vue2.0環境搭建
安裝node.js
下載地址 https://nodejs.org/zh-cn/ (下載長期使用版本就行,下載完了雙擊傻瓜式安裝,)
安裝完了之後開啟命令視窗 快捷鍵 win+R 輸入 cmd 回車
輸入 node -v 和 npm -v 如果顯示了版本號 說明已經安裝成功!!!
安裝淘寶映象
接下來安裝cnpm,因為許多npm包都是在國外,安裝起來特別慢,所以使用淘寶的映象伺服器。
安裝命令:npm install -g cnpm --registry=https://registry.npm.taobao.org
安裝webpack
安裝命令:cnpm install webpack -g
安裝vue腳手架
安裝命令:cnpm install -g vue-cli
安裝完後,可以輸入vue,然後回車,如果出現vue的資訊,則說明安裝成功了。
建立專案
D: 可以進入D盤
cd 資料夾名 進入資料夾
vue init webpack my-vue(專案資料夾名) 回車之後等一會之後會要求輸入一些專案資訊
Project name ----專案名稱,使用英文
Project description ----專案描述,可寫可不寫
Author Datura ----專案建立者,可寫可不寫
Vue build ----直接回車
Install vue-router? (Y/n) Y ----是否安裝Vue路由,我選擇的是
Use ESLint to lint your code? (Y/n) n ----是否啟用eslint檢測,我選擇no
Set up unit tests? (Y/n) n ----是否建立單元測試,我選擇no
Setup e2e tests with Nightwatch? (Y/n) Y---設定e2e測試 我選擇的是
完事之後進入到剛剛建立的資料夾下就可以看到我們的專案,如圖
安裝專案依賴
一定要從官方倉庫安裝,npm 伺服器在國外所以這一步安裝速度會很慢。
安裝命令:npm install
不要從國內映象cnpm安裝(會導致後面缺了很多依賴庫)
安裝命令:cnpm instal
安裝 vue 路由模組 vue-router 和網路請求模組 vue-resource
安裝命令:cnpm install vue-router vue-resource --save
啟動專案
啟動命令:npm run dev (如果看到下圖顯示就代表已經啟動了,將8080網址複製到瀏覽器就可以開啟)
如果瀏覽器顯示這樣的話就代表已經啟動成功了!!!~~~
預設埠是8080,如果電腦目前有其他的專案佔用了8080埠,專案啟動會報錯,可以在專案中config > index.js
中找到port:8080
直接修改成其他埠就可以了