1. 程式人生 > >vue-cli快速構建專案結構

vue-cli快速構建專案結構

    安裝至預設路徑即可

2、 確認node.js是否安裝成功

開啟cmd命令提示符 輸入 node -v  返回node.js版本號 則表示node.js安裝成功

 

cmd命令列輸入 npm -v 返回npm包管理器版本號 則表示npm能裝成功(node.js安 裝自帶npm)

3、 命令列安裝nrm   (npm為包管理器 專案依賴包會使用npm安裝 具體指令差異百度一下)

命令列輸入npm install nrm -g  (全域性安裝nrm)

    安裝成功後命令行輸入nrm use taobao (改npm下載路徑為淘寶映象)

4、 命令列輸入 npm install vue -g   (全域性安裝vue)

5、 命令列輸入 npm install vue-cli -g  (全域性安裝vue-cli腳手架)

6、 命令列輸入 npm install webpack -g  (全域性安裝webpack構建工具)

7、 新建一個或者找一個資料夾(放專案檔案) 然後在該資料夾下 開啟命令列

命令列輸入 vue init webpack my-project (基於vue-cli初始化一個vue專案)

各種選項 :不認識的先回車預設  大概是  專案名  專案描述  作者名 然後有幾個選 擇性安裝的載入器 其中 ESlint是制定編碼規範 TEST是單元測試 等等  輸入y或者

n 即可

C:\Users\Administrator\Desktop\myproject>vue init webpack my-project

? Project name my-project

? Project description A Vue.js project

? Author candy

? Vue build standalone

? Install vue-router? Yes

? Use ESLint to lint your code? No

? Setup unit tests with Karma + Mocha? Yes

? Setup e2e tests with Nightwatch? Yes

   vue-cli · Generated "my-project".

   To get started:

     cd my-project

     npm install

     npm run dev

   Documentation can be found at https://vuejs-templates.github.io/webpack

8、 在生成的專案資料夾下開啟命令列

9、 輸入 npm install   (安裝專案依賴)

10、 安裝完成後 繼續輸入  npm run dev  (開發模式執行  就是跑一下)

11、 成功後會自動開啟預設瀏覽器 顯示index頁面