搭建vue腳手架(vue-cil)
阿新 • • 發佈:2019-01-04
準備工具:node webpack
1、node的安裝
node的安裝包從官網獲取,安裝是很簡單的,我目前是已經安裝過的 window+r 然後輸入 cmd 可以到達命令列頁面
輸入 node -v (注意node後有空格)可以獲得當前的node版本號
npm的全稱:Node Package Manager.(Node包管理器),是Node的包的一個管理工具
1)下載並安裝 npm install
2)升級安裝包 npm update
3)解除安裝安裝包 npm uninstall/rm
由於npm的資源有限制,所以還需要安裝淘寶的npm映象--cnpm
cnpm是一個完整 npmjs.org
映象,你可以用此代替官方版本(只讀),同步頻率目前為 10分鐘 一次以保證儘量與官方服務同步。
可以參照淘寶cnpm網址進行安裝
或者直接輸入
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
等待安裝完成 輸入 cnpm -v 可以檢視當前cnpm版本號
2、接下來就是安裝vue了
在命令列 輸入
cnpm install vue
3、安裝 vue-cil腳手架構建工具
cnpm install --global vue-cli
4、安裝基於webpack的專案
更改目錄到想安裝的地址然後初始化一個專案,有如下兩種方法
vue init webpack my-project //初始化一個專案
vue init webpack-simple my-project //初始化一個簡單專案
執行初始化命令的時候會讓使用者輸入幾個問題的選擇,可以根據自己意願自己選擇,嫌麻煩的話可以直接回車選擇預設選項
需要注意的是 專案名稱不是是大寫,否則會報錯
5、剛開始的專案是沒有依賴的 直接 npm run dev 是會報err的
所以首先應該
cnpm install
6、待依賴安裝完成後,執行專案
npm run dev
7、在瀏覽器中開啟命令列給出的地址(如:我的地址是 http://localhost:8080),若出現下圖,則代表安裝成功