1. 程式人生 > >vue環境的搭建

vue環境的搭建

一、首先要安裝nodejs :

別去官網下,慢的要死,這是國內的什麼版本都有。地址

這是我下載的。

然後就傻瓜式安裝。

驗證是否安裝成功

二、node.js的環境變數的新建。  //我安裝的路徑是D:\Develop\Nodejs

其實安裝完node,就自動在path裡增加環境變數,但是為了以後的本地部署專案,我們需要找到node.js的安裝根目錄,在當中新建“node_global”和"node_cache"兩個資料夾。

1 啟動cmd依次執行以下兩條命令

  

npm config set prefix " D:\Develop\Nodejs\node_global"

 

npm config set cache " D:\Develop\Nodejs\node_cache"

 

2、設定環境變數:
說明:設定環境變數可以使得住任意目錄下都可以使用cnpm、vue等命令,而不需要輸入全路徑
a)新增系統變數NODE_PATH:把變數值設定成“D:\Develop\Nodejs\node_global\node_modules” (這樣就可以把後面全域性安裝的裝到global裡並且可以直接用命令使用。)
b)修改使用者變數PATH:選中PATH,點選編輯,把“D:\Develop\Nodejs\node_global;”加到前面

三、安裝淘寶的npm映象
1、命令

npm config set registry https://registry.npm.taobao.org

2、驗證命令

npm config get registry

如果返回https://registry.npm.taobao.org,說明映象配置成功。
3、安裝cnpm
輸入:

npm install -g cnpm --registry=https://registry.npm.taobao.org

即可安裝npm映象,以後再用到npm的地方直接用cnpm來代替就好了。
這個其實看個人愛好吧,因為npm在國內下載速度是很慢,所以就用npm下載安裝cnpm可以更快的下載後面的依賴等等。注意(cnpm下載的依賴不全,儘量少用)

四、安裝全域性vue-cli腳手架

npm install -g vue-cli

這時vue就安裝好了在dos命令敲 vue -V 就可看到vue版本了


使用npm-cli建立模板專案

vue init webpack vue_demo

解釋上面命令
webpack是最簡單的vue一個模板
vue_demo是專案名稱
然後我們進入這個專案所在的地址,依次命令如下:

cd vue_demo
npm install
npm run dev(或者npm start)