1 環境搭建
搭建JavaScript開發環境有很多種組合，本文中採用Visual Studio Code和Node.js的組合，詳細如下所示：
1.1 Node.js環境搭建
1.1.1 下載Node.js
不管是基於Windows還是Linux，都需要下載相應的安裝包，到Node.js官網根據系統下載相應版本的Node.js版本。下載地址如下：
1.1.2 安裝Node.js
1.1.2.1 基於Windows
1.1.2.1.1 安裝Node.js
在Windows中安裝比較簡單，按照嚮導提示安裝即可。
1.1.2.1.2 配置Node.js
- 1、在安裝目錄中創建兩個文件夾node_cache和node_global
這裏創建的兩個文件夾主要是用來配置npm安裝的全局模塊所在的路徑和緩存cache的路徑。若在以後執行npm install express [ -g ](-g代表global，全局安裝的意思)語句時，會將安裝的模塊安裝到%USERPROFILE%\AppData\Roaming\npm。如果希望自定義安裝位置，則創建以上兩個文件夾，再打開命令行窗口，執行以下命令即可：
npm config set prefix "D:\Program Files\Nodejs\node_global"
npm config set cache "D:\Program Files\Nodejs\node_cache"
npm默認的源地址在國外，訪問比較慢，可以配置爲國內源，設置如下所示：
C:\Users\Surpass>npm config set registry https://registry.npmmirror.com
C:\Users\Surpass> npm get registry
https://registry.npmmirror.com/
- 2、配置環境變量
在path中添加node的安裝位置，如本例中Node.js安裝目錄爲：D:\Program Files\Nodejs\node_modules
新建一個系統變量，並按如下所示進行設置：
環境變量名稱：NODE_PATH
環境變量值：D:\Program Files\Nodejs\node_global\node_modules
- 3、打開命令行窗口，輸入以下命令
PS C:\Users\Surpass> node -v
v17.8.0
PS C:\Users\Surpass> npm -v
8.5.5
輸入node -v顯示node版本說明已經安裝成功
輸入npm -v顯示npm版本說明自帶的npm已經安裝成功，其作用就是對Node.js依賴的包進行管理
環境變量這一步，在安裝時，若勾選Add to PATH則不需要單獨配置環境變量
- 4、測試，配置完成，安裝一個module測試一下，以express爲例，示例如下所示：
C:\Users\Surpass> npm install express -g
added 48 packages, and changed 2 packages in 2s
注意：如果安裝時不加-g參數，則安裝的模塊會安裝在當前路徑下。
1.1.2.1 基於Linux
1.1.2.1.1 安裝Node.js
將下載下來的Node.js版本包解壓，並放置相應的目錄，如下所示：
tar -xf node-v17.8.0-linux-x64.tar.xz -C /usr/local/node.js/
1.1.2.1.2 配置Node.js
- 1、配置環境變量
vim /etc/profile
# 增加以下內容
export NODEJS_HOME=/usr/local/node.js
export PATH=$PATH:$NODEJS_HOME/bin
source /etc/profile
- 2、測試配置
# node -v
v17.8.0
# npm -v
8.5.5
另外，也可以通過創建軟鏈接的方式實現同樣的效果
1.2 開發環境配置
1.2.1 安裝Visual Studio Code
Visual Studio Code，簡稱爲VS Code是微軟開源的一款文本編輯器，在安裝種類插件之後，也可以做一款輕型的IDE工具，下載完成之後，按照提示即可，下載地址如下：
1.2.2 配置VS Code
- 1、使用VS Code選擇打開或新建文件夾，示例文件夾如下所示：
C:\Users\Surpass\Documents\NodejsProjects
- 2、 新建一個js文件，輸入以下代碼：
(function name(params) {
console.log("Hello world")
})();
按F5鍵，並選擇Node.js運行即可
- 也可以安裝插件Code Runner，在代碼右鍵選擇Run Code
- 如果不需要編寫工程化的代碼，在Chrome也可以編寫一些簡章的JavaScript代碼，打開瀏覽器按F12鍵，切換到Console選項卡即可。
原文地址：https://www.jianshu.com/p/f197706f9dbf
本文同步在微信訂閱號上發佈，如各位小夥伴們喜歡我的文章，也可以關注我的微信訂閱號：woaitest，或掃描下面的二維碼添加關注：
