安裝Vue.js和命令行工具
- Vue基于Node.js，所以需要安裝Node，所以第一步，我們先下載安裝Node.js。下載地址是：http://nodejs.cn/download/ 選擇你對應(yīng)的系統(tǒng)，下載相應(yīng)的版本。Windows用戶還要注意系統(tǒng)的位數(shù)。
- 下載完成后，打開安裝文件，一直下一步直到完成安裝。
-
win+R,輸入powershell，打開windows命令行工具
image.png
4、輸入npm，查看是否安裝成功
image.png
出現(xiàn)上圖結(jié)果則安裝成功
-
應(yīng)為默認(rèn)的npm倉庫源在國外，速度很慢，所以我們安裝淘寶的npm源cnpm。
打開http://npm.taobao.org/ 找到這一句：
image.png 在命令行輸入：
npm install -g cnpm --registry=https://registry.npm.taobao.org
等待安裝完成。
- 然后我們就可以安裝Vue了，命令行輸入
cnpm install -g vue
- 安裝vue-cli，腳手架工具，在命令行輸入：
cnpm install -g vue-cli
- 這時我們在命令行輸入
vue，出現(xiàn)下圖結(jié)果，表示這一步我們?nèi)砍晒?/li>
image.png
初始化Vue工程
現(xiàn)在我們就可以初始化一個項目了。首先我們要定位到我們的項目地址，我的項目地址是D盤WWW文件夾
在powershell中，
cd是改變目錄的意思，cd 目錄就是轉(zhuǎn)到該目錄，cd ..返回上一層目錄，ls是列出文件，輸入一部分文件名后，可以按tab鍵自動補全。
-
我們在命令行中
cd到d盤www文件夾下：
image.png -
這是我們需要新建一個vue文件夾，
mkdir命令就是新建文件夾：
image.png 再
cd到VueJS這是我們可以初始化Vue項目了，用命令
vue init webpack 項目名
可以初始化：
image.png
-
然后根據(jù)提示輸入項目名，項目描述和作者信息：
image.png -
出現(xiàn)這個提示，按回車鍵：
image.png -
后面的是否需要安裝XXX全部選
n
image.png -
到這里全部初始化完成
image.png -
這是需要按照他的提示來，
image.png 先進(jìn)入項目目錄
cd todolist
image.png
- 再安裝依賴項
cnpm install
image.png
等待安裝完成
image.png
-
安裝完成后cnpm run dev 啟動服務(wù)器，這是可以訪問http://localhost:8080訪問此項目
image.png -
到此項目初始化完成。
image.png
開始寫吧！
這里可以參考慕課網(wǎng)的相關(guān)課程：
戳這里
結(jié)束
var author = {
name:'丁波',
GitHub:'dingbo1028',
University:'BNUZ'
}
