1. 程式人生 > >vue-cli腳手架搭建vue專案

vue-cli腳手架搭建vue專案

一、下載nodejs並安裝和配置環境變數

1.在nodejs的安裝目錄下新建node_cache和node_global兩個資料夾。

2.設定上面兩個資料夾,以後安裝的-g的全域性包都會在配置的目錄下了。
    npm config set prefix "D:\Program Files\nodejs\node_global"
    npm config set cache "D:\Program Files\nodejs\node_cache"

3.配置環境變數
   開啟計算機的環境變數,找到系統變數,新增一項 NODE_PATH,值為安裝目錄下的nodejs,
   D:\Program Files\nodejs\node_global\node_modules

4.變數配置完,可以輸入npm install express  命令試一下看能否正常用安裝

5.配置淘寶映象cnpm,可以更快下載依賴包。
   npm install -g cnpm --registry=https://registry.npm.taobao.org

二、安裝vue-cli腳手架

以上環境都配置好後,開啟命令視窗,輸入:
    cnpm install vue-cli -g 
會自動下載vue-cli安裝到配置好的全域性目錄裡去

三、使用vue-cli腳手架建立專案

 1. vue init webpack 專案名  (專案名小寫,其他一直按回車,注意安裝eslint時候選擇N不安裝)
 2. cd project
 3. cnpm install
 4. cnpm run dev

四、完成安裝啟動後,看下圖就知道啟動成功了