1. 程式人生 > >Vue、J2ee -> 001 : Vue專案的建立過程

Vue、J2ee -> 001 : Vue專案的建立過程

使用命令列的方式,通過vue-cli的腳手架進行模板下載打包:

1、安裝node.js環境,檢視node版本並確認是否安裝成功【node -v】2、安裝WebStorm開發工具(使用WebStorm來開發Vue專案)3、在WebStorm中直接引入Vue.js檔案就可以進行開發測試   a、和使用eclipse進行開發無二差別   b、但是可以在WebStorm中可以時間檢視開發情況,不用象eclips還需要啟動tomcat伺服器,WebStorm記憶體類似tomcat的伺服器4、以上只是Vue.js的簡單使用,還不屬於Vue專案。

5、建立Vue專案(通過腳手架下載模板專案,在模板專案基礎之上進行開發)

  a、需要node環境,上面已經安裝   b、需要vue-cli腳手架,用於打包、測試、部署...Vue專案     安裝命令【npm install -g vue-cli】,檢視版本號及是否安裝成功【vue -V】   c、Vue模板的下載,有多個模板可供下載,常用模板【webpack】     下載命令【vue init webpack 專案名稱(不能有大寫字母存在)】     安裝過程(引數都有預設值,也可以修改):       01、專案名稱提示       02、描述       03、作者     04、是否使用vue-roter路由,如果不使用可以不安裝     05、是否需要ESLint,一般都需要     06、是否需要單元測試庫,如果是基於功能測試可以不需要     07、與06類似     08、使用什麼方式下載,也可以手動下載     09、如果上面選擇了手動下載會直接退出。     10、如果選擇手動下,會直接退出花前月下給出手動下載的步驟       cd 專案名稱       npm install(or if using yarn: yarn)       npm run lint -- -- fix (or for yarn: yarn rum lint -- fix)       npm run dev       上面的意思是需要進入到專案目錄資料夾下進行操作       使用npm install命令進行下載,這個比較耗時       執行npm run lint -- -- fix       進行打包、並且執行【npm run dev】,完成之後會給出訪問地址,在瀏覽器中使用給出的地址進行訪問

以下是部分圖片