怎麼構建vue cli專案

2022-05-06 12:48:09 字數 1447 閱讀 3513

1.安裝node.js(已安裝可直接跳過,建議檢視node版本,node -v);

2.npm包管理器,是整合在node中的,可跳過(npm -v);

3.由於npm的有些資源被牆,為了更快更穩定,所以我們需要切換到**的npm映象——cnpm。(全域性安裝: npm install -g cnpm,檢視版本:cnpm -v)

5.安裝vue-cli腳手架構建工具,全域性安裝 cnpm install --global vue-cli

6.建立乙個基於 webpack 模板的新專案, vue init webpack my-project,(my-project為自己專案的資料夾)

注意事項:

project name (my-project) # 專案名稱(我的專案)

project description (a vue.js project) # 專案描述乙個vue.js 專案

author 作者(你的名字)

install vue-router? (y/n) # 是否安裝vue路由(但頁面應用需要的模組)

use eslint to lint your code? (y/n) # 使用 eslint 到你的**? (y [ yes ] / n [ no ])建議n

pick an eslint preset (use arrow keys) # 選擇乙個預置eslint(使用箭頭鍵)建議n

setup unit tests with karma + mocha? (y/n) # 設定單元測karma + mocha? (y/ n)建議n

setup e2e tests with nightwatch? (y/n) # 設定端到端測試,nightwatch? (y/ n)建議n

7.安裝專案依賴, cnpm install ($ cnpm i)

8.執行環境, cnpm run dev;

安裝cnpm:npm install -g cnpm --registry=

安裝yarn :npm install -g yarn

安裝vue/cli3.0:npm install -g @vue/cli    (vuecreate my-project)

搭建專案:vue -v 能出現版本號表示安裝成功,vue create project建立專案目錄,選擇manually select features(自定義安裝)

檢視遠端主機名:2.git remote show

檢視所有分支:3.git branch -a (綠色當前所在分支,紅色就是遠端分支列表),

檢視所有變更檔案:4.git status(檢視所有變更檔案)

新增所有新增檔案:5.git add .(新增新增檔案)

提交**到本地:6.git commit -m "修復xxbug"

拉取遠端** 7.git pull 《遠端主機名》 《遠端分支名》

提交**到伺服器 8.git push 《遠端主機名》 《遠端分支名》

使用vue cli構建專案。

所以操作皆在命令列下完成 npm install golbal vue clivue init webpack workname workname為專案名 tables areproject name 專案名 不可大寫 project description 專案描述 author 作者vue bu...

vue cli快速構建專案結構

安裝至預設路徑即可 2 確認node.js是否安裝成功 開啟cmd命令提示符 輸入 node v 返回node.js版本號 則表示node.js安裝成功 cmd命令列輸入 npm v 返回npm包管理器版本號 則表示npm能裝成功 node.js安 裝自帶npm 命令列輸入npm install n...

vue cli構建的專案優化

主要是兩個 1.路由懶載入 這個就是只返回你訪問的資源,其餘的資源不會一下全部載入 2.cdn加速打包 這個玩意的意思就是智慧型尋找離訪問者最近的伺服器站點返回相應資源的意思 路由懶載入 既然是路由懶載入肯定就是跟路由相關了 原本路由是這樣寫的 import vue from vue import ...