NodeJS、NPM安裝配置步驟(windows版本)

1、windows下的NodeJS安裝是比較方便的（v0.6.0版本之后，支持windows native），只需要登陸官網（http://nodejs.org/），便可以看到首頁的“INSTALL”按鈕，直接點擊就會自動下載安裝了。

 

2、安裝過程基本直接“NEXT”就可以了。（windows的安裝msi文件在過程中會直接添加path的系統變量，變量值是你的安裝路徑，例如“C:\Program Files\nodejs”）。選擇帶manage的安裝

 

3、安裝完成后可以使用cmd（win+r然后輸入cmd進入）測試下是否安裝成功。方法：在cmd下輸入node -v，出現下圖版本提示就是完成了NodeJS的安裝。

 4、npm的安裝。由於新版的NodeJS已經集成了npm，所以之前npm也一並安裝好了。同樣可以使用cmd命令行輸入"npm -v"來測試是否成功安裝。如下圖，出現版本提示便OK了。

 

 

5、常規NodeJS的搭建到現在為止已經完成了，急不及待的話你可以在”cmd“輸入”node“進入node開發模式下，輸入你的NodeJS第一句：”hello world“ - 輸入：console.log('hello world')。

 

6、npm作為一個NodeJS的模塊管理，之前我由於沒有系統地看資料所以導致安裝配置模塊的時候走了一大段彎路，所以現在很有必要列出來記錄下。

 

①、我們要先配置npm的全局模塊的存放路徑以及cache的路徑，例如我希望將以上兩個文件夾放在NodeJS的主目錄下，便在NodeJs下建立"node_global"及"node_cache"兩個文件夾。如下圖

②、啟動cmd，輸入

npm config set prefix "C:\Program Files\nodejs\node_global"
以及
npm config set cache "C:\Program Files\nodejs\node_cache"

③、現在我們來裝個模塊試試，選擇express這個比較常用的模塊。同樣在cmd命令行里面，輸入“npm install express -g”（“-g”這個參數意思是裝到global目錄下，也就是上面說設置的“C:\Program Files\nodejs\node_global”里面。）。待cmd里面的安裝過程滾動完成后，會提示“express”裝在了哪、版本還有它的目錄結構是怎樣。如下圖

 

④、關閉cmd，打開系統對話框，“我的電腦”右鍵“屬性”-“高級系統設置”-“高級”-“環境變量”。如下圖

 

⑤、進入環境變量對話框，在系統變量下新建"NODE_PATH"，輸入”C:\Program Files\nodejs\node_global\node_modules“。（ps：這一步相當關鍵。）

2014.4.19新增：由於改變了module的默認地址，所以上面的用戶變量都要跟着改變一下（用戶變量"PATH"修改為“C:\Program Files\nodejs\node_global\”），要不使用module的時候會導致輸入命令出現“xxx不是內部或外部命令，也不是可運行的程序或批處理文件”這個錯誤。

⑥、以上步驟都OK的話，我們可以再次開啟cmd命令行，進入node，輸入“require('express')”來測試下node的模塊全局路徑是否配置正確了。正確的話cmd會列出express的相關信息。如下圖（如出錯一般都是NODE_PATH的配置不對，可以檢查下第④⑤步）

 

 

 

安裝完以上之后即可配置vue運行環境

 

二、cnpm的安裝
安裝完node之后，npm包含的很多依賴包是部署在國外的，在天朝，大家都知道下載速度是超級慢啊。所以我們要安裝cnpm，cnpm是淘寶對npm的鏡像服務器，這樣依賴的包安裝起來就快多了。
安裝命令為：npm install -g cnpm --registry=https://registry.npm.taobao.org

三、vue-cli的安裝
vue-cli是vue官方提供的一個命令行工具，可用於快速搭建大型單頁應用。該工具提供開箱即用的構建工具配置，帶來現代化的前端開發流程。只需一分鍾即可啟動帶熱重載、保存時靜態檢查以及可用於生產環境的構建配置的項目。
安裝命令為：cnpm install -g vue-cli，回車，等待安裝。

安裝完后，檢查是否安裝成功，輸入vue，出現以下提示表示安裝成功。

四、試試新建一個Vue項目
（1）新建一個項目文件夾，命名為 vue-demo，cd到此文件夾，輸入:vue init webpack vue-demo，回車，按照如下操作進行初始化：

我們暫時不適用模板提供的測試框架，Karma + Mocha，以及Nightwatch。
（2）項目目錄

（3）安裝項目依賴的包
cd到vue-demo 文件夾，執行cnpm install，安裝依賴包，安裝完成之后，項目目錄下多了node_modules：

（4）運行項目
在命令行里輸入 cnpm run dev(進入項目所在的目錄)，執行完成后啟動項目，瀏覽器出現以下接結果，說明啟動成功。注意瀏覽器的版本，低版本的不支持哦。