1.首先下載node.js，下載網(wǎng)站如下https://nodejs.org/en/，切記不要選擇中文版本去下載點擊LTS版本，左邊的，無腦點擊下一步。node。js是自帶npm的
如果網(wǎng)頁經(jīng)常加載不出有bug，我推薦大家多敲
npm cache clean --fore來清除緩存
npm鏡像切換淘寶鏡像
npm config set registry https://registry.npm.taobao.org
查看鏡像源是否切換成：
npm config get registry
第二步驟：安裝yarn
npm install -g yarn
yarn?鏡像切換淘寶鏡像
yarn config set registry https://registry.npm.taobao.org/
查看yarn的路徑?
yarn config get registry
第三步：安裝vuecli，直接打開https://cli.vuejs.org/zh/guide/installation.html，按照步驟操作參考文檔上的最新代碼我這個給你們參考用的，切記一定要指定版本號npm install -g @vue/cli 后面@版本（如3.9.2）。不加默認就變成最新版本，他會默認下vue2.5等
npm install -g @vue/cli@3.9.2
提醒：如果node-sass出錯，要用 cnpm，刪除你的項目中node_modules這個包
再打cnpm i
vue安裝完成，安裝完成如下顯示：
可查看vue --version 查看版本號確認是否安裝上了，正常是3.9.2
vue --version
第四步：創(chuàng)建項目：打開你的cmd，win+R，加cmd，在桌面創(chuàng)建個項目cd +拖到文件到cmd終端vue create .創(chuàng)建項目
vue create .
Babel 可解析css
TypeScript 更改開發(fā)語言
PWA 離線開發(fā)
Rounter 路由
Vuex? 做復(fù)雜狀態(tài)管理
CSS-pre-processors css預(yù)處理器
Linter /formatter 團隊代碼保持風(fēng)格的一致性
安裝步驟出現(xiàn)如下代碼
? Generate project in current directory? Yes 意思是否這個文件夾下直接懟文件，直接打yes，打no就又創(chuàng)建了新文件
? Please pick a preset: 選第二個
？Manually select features ？選擇你要的功能，你要什么選擇什么空格確認? 按回車
? Where do you prefer placing config for Babel, PostCSS, ESLint, etc.?選擇：In dedicated config files
? Save this as a preset for future projects? 其他項目要用的你項目嗎？選NO
? Pick the package manager to use when installing dependencies: 選yarn還是npm ，選yarn創(chuàng)建
第五步創(chuàng)建成功執(zhí)行，在集成終端中啟動，一定要文件第一個目錄，比如這個在app的內(nèi)容啟動
$ yarn serve
輸入鏈接，復(fù)制到瀏覽器
代碼對應(yīng)的意思：
serve 是開發(fā)模式的啟動
build 是上線模式的啟動
lint 檢查你的es-lint的風(fēng)格給你修復(fù)
遇到的問題，沒遇到就不用看了：
問題一：無法將“vue”項識別為 cmdlet、函數(shù)、腳本文件或可運行程序的名稱
vue : 無法將“vue”項識別為 cmdlet、函數(shù)、腳本文件或可運行程序的名稱。請檢查名稱的拼寫，如果包括路徑，請確保路徑正確，然后再試一次。
所在位置 行:1 字符: 1
? ? + CategoryInfo? ? ? ? ? : ObjectNotFound: (vue:String) [], CommandNotFoundException
? ? + FullyQualifiedErrorId : CommandNotFoundException
刪除原來的vue，刪除方法
1.cmd輸入vue --version后直接如果顯示出來版本號打where vue ，把鏈接找到直接手動刪除，找到路徑文件復(fù)制手動刪除
where vue
重新裝vue
npm install -g @vue/cli@3.9.2
問題二：yarn報錯，系統(tǒng)上禁止運行腳本
kID=135170 中的 about_Execution_Policies。
所在位置 行:1 字符: 1
? ? + CategoryInfo? ? ? ? ? : SecurityError: (:) []，PSSecurityException
? ? + FullyQualifiedErrorId : UnauthorizedAccess
yarn : 無法加載文件 C:\Users\hjt\AppData\Roaming\npm\yarn.ps1，因為在此系統(tǒng)上禁止運行腳本。有關(guān)詳細信息，請參閱 https:/go.microsoft.com/fwlink/?Lin
kID=135170 中的 about_Execution_Policies。
所在位置 行:1 字符: 1
+ yarn versiob
? ? + CategoryInfo? ? ? ? ? : SecurityError: (:) []，PSSecurityException
? ? + FullyQualifiedErrorId : UnauthorizedAccess
解決方案：
以 管理員身份 運行 Windows PowerShell ，輸入以下命令：
set-ExecutionPolicy RemoteSigned
輸入y可解決
問題三：網(wǎng)頁加載不了
多敲
npm cache clean --fore來清除緩存
問題四：代碼錯誤ECONNREFUSED
npmERR! node v6.9.5npmERR! npm v3.10.10npmERR! codeECONNREFUSEDnpmERR! errnoECONNREFUSEDnpmERR! syscall connectnpmERR!Error: connectECONNREFUSEDxxx.xxx.xx.xxx:xxxnpmERR! atObject.exports._errnoException(util.js:1022:11)npmERR!Ifyou are behind a proxy, please make sure that thenpmERR!'proxy'config is set properly.See:'npm help config'
執(zhí)行下面三行代碼可解決
npm config set proxy null
npm config set https-proxy null
npm config set registry http://registry.npm.taobao.org
問題五：Cannot find module 'webpack'
yarn run v1.22.18
ERROR? Error: Cannot find module 'webpack'
? ? ? ? Require stack:
? ? ? ? - I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\config\base.js
? ? ? ? - I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\Service.js
? ? ? ? - I:\project\hdemo\hdemo\node_modules\@vue\cli-service\bin\vue-cli-service.js
Error: Cannot find module 'webpack'
Require stack:
- I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\config\base.js
- I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\Service.js
- I:\project\hdemo\hdemo\node_modules\@vue\cli-service\bin\vue-cli-service.js
? ? at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
? ? at Function.Module._load (node:internal/modules/cjs/loader:778:27)
? ? at Module.require (node:internal/modules/cjs/loader:1005:19)
? ? at require (node:internal/modules/cjs/helpers:102:18)
? ? at module.exports (I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\config\base.js:6:19)
? ? at I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\Service.js:82:9
? ? at Array.forEach (<anonymous>)
? ? at loadedCallback (I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\Service.js:80:20)
? ? at Service.init (I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\Service.js:97:14)
? ? at Service.run (I:\project\hdemo\hdemo\node_modules\@vue\cli-service\lib\Service.js:247:16)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
