1. 程式人生 > 其它 >安裝vue腳手架

安裝vue腳手架

安裝nodejs
下載地址:http://nodejs.cn/download/

測試nodejs 是否安裝 ----在cmd中輸入node -v

測試npm是否自動安裝
npm -v

配置下載源—全域性安裝nrm

npm install nrm -g
使用taobao映象源
nrm ls 檢視映象源
nrm use taobao

全域性安裝腳手架

npm i @vue/cli -g

測試安裝是否成功

vue -V

建立VUE專案

vue create 專案名

  

專案配置
選擇預設

Please pick a preset: (Use arrow keys) ----使用鍵盤上下鍵選擇 回車確定
default (babel, eslint) ----預設只安裝babel和eslint
Manually select features ---- 自定義

手動選擇外掛(1,4,5,6)

Check the features needed for your project: ----空格選擇,a全選,i反選 回車確定
Babel ---- 將高階版本ES轉換為瀏覽器識別的JS語法
TypeScript---- JS的超集,提供了JS面向物件支援
Progressive Web App (PWA) Support ----漸進web app支援
Router ----路由、請求所對應的地址
Vuex ---- 資料狀態管理器、用於多頁面傳參
CSS Pre-processors ----CSS預處理,將高階CSS語法轉換為瀏覽器識別CSS語法
Linter / Formatter ----語法檢測
Unit Testing ----單元測試
E2E Testing ----測試


選擇路由模式

Use history mode for router?
History模式---- yes
Hash模式---- no 路由的後方有#只重新整理部分內容(建議採用)


選擇CSS預處理

Pick a CSS pre-processor
Sass/SCSS (with dart-sass)
Sass/SCSS (with node-sass)
Less
Stylus

  


選擇外掛的配置存放

Where do you prefer placing config for Babel, ESLint, etc
In dedicated config files ----獨立的配置檔案
In package.json ----放在package.json中


是否儲存預設

Save this as a preset for future projects ----是否把你選擇的作為預設
N不儲存
Y儲存 


切換到專案資料夾—cd 專案名

執行—npm run serve
-輸入地址: http://localhost:8080/


專案建立成功
————————————————
原文連結:https://blog.csdn.net/hhhhhhhhhtr/article/details/106861460