首先下載node.js/下載地址: http://nodejs.cn/download/
選擇next:
第一次安裝選擇change:
注: repair是修復之前有問題的node.js/remove移除電腦上的node.js
接下來還是選擇next一直按照提示選擇就行(中間有個選對勾的,不要打對勾),最后安裝成功
第二步打開終端 Win+R鍵
ctrl和alt之間的這個就是win鍵
然后輸入cmd
點擊確定彈出電腦終端如圖:
然后在終端輸入
node -v
查看node是否安裝成功,成功會顯示安裝版本
我的是剛裝的最新版本v12.13.0,
接下來就開始安裝vue腳手架,在終端輸入然后回車等他自動安裝成功
npm install --global vue-cli
安裝過程有點兒慢,耐心等待(注意:global 是全局安裝vue-cil)
終端輸入:
vue -V
查看腳手架版本
出現版本號,自此腳手架安裝完成,
第三步,全局安裝webpack
接下來安裝webpack在終端輸入:
npm install --global webpack
(注意:只要是global就是全局安裝)
安裝結束輸入
webpack -V
檢查是否安裝成功
最后創建vue項目
在終端輸入:
vue init webpack my-project
my-project是創建的項目名稱
提示依次是①項目名稱
②項目描述
③作者(可輸入自己的名字,也可以空着)
④vue的構建,一般就選擇第一個按回車即可
⑤安裝vue-router
⑥是否使用ESLint來lint你的代碼(規范代碼用的,注意了這一條新手一定要選擇no,輸入n再回車即可)
⑦設置單元測試
⑧選擇一個測試運行程序
jest:(Jest是由Facebook發布的開源的、基於Jasmine的JavaScript單元測試框架)
karma and mocha:(將項目運行在各種瀏覽器 和 定義測試模塊)
none (configure it yourself):(自定義你的項目)
⑨設置e2e測試
⑩創建項目后是否要使用npm install
Yes, use NPM:使用npm
Yes, use Yarn:使用yarn
No, I will handle that myself:(自己自定義)
一路回車就行,(注意第六條,視你的個人情況定,新手最好選n),開始創建項目
創建成功后提示有兩個
首先按照路徑找到你的項目文件夾
找到之后在終端輸入cd空格拖動文件夾拖到終端,
也可以按照路徑自己輸入,敲回車,就會進入指定文件夾
然后輸入
npm run start
回車,
一般都是 http://localhost:8080 ,如果端口號占用就會自動使用沒有占用的端口號,是你們的而定
最后輸入,回車
如圖:一個新的vue項目搭建好了