安裝vscode，安裝好後按照圖安裝插件
打開vscode 文件->首選項->設置
然後把下面代碼粘貼進去
// 將設置放入此文件中以覆蓋默認設置
{
"editor.fontSize": 22,
"workbench.sideBar.location": "left",
"workbench.statusBar.visible": false,
"workbench.activityBar.visible": false,
"terminal.integrated.cursorStyle": "line",
"terminal.integrated.cursorBlinking": true,
"explorer.openEditors.visible": 0,
"editor.renderIndentGuides": false,
"workbench.colorTheme": "Material Theme",
"workbench.iconTheme": "material-icon-theme",
// vscode默認啓用了根據文件類型自動設置tabsize的選項
"editor.detectIndentation": false,
// 重新設定tabsize
"editor.tabSize": 2,
// #每次保存的時候自動格式化
// "editor.formatOnSave": true,
// #每次保存的時候將代碼按eslint格式進行修復
"eslint.autoFixOnSave": true,
// 添加 vue 支持
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "vue",
"autoFix": true
}
],
// #讓prettier使用eslint的代碼格式進行校驗
"prettier.eslintIntegration": false,
// #去掉代碼結尾的分號
"prettier.semi": false,
// #使用帶引號替代雙引號
"prettier.singleQuote": true,
// #讓函數(名)和後面的括號之間加個空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
// 是否插入冒號
"stylusSupremacy.insertColons": false,
// 是否插入分好
"stylusSupremacy.insertSemicolons": false,
// 是否插入大括號
"stylusSupremacy.insertBraces": false,
// import之後是否換行
"stylusSupremacy.insertNewLineAroundImports": false,
// 兩個選擇器中是否換行
"stylusSupremacy.insertNewLineAroundBlocks": false,
//關閉html沒閉合標籤報錯
"vetur.validation.template": true,
"vetur.format.defaultFormatterOptions": {
"prettier": {
"semi": false,
"singleQuote": true
},
"prettyhtml": {
"tabWidth": 4,
"wrapAttributes": false,
"printWidth": 100,
"singleQuote": false
},
"js-beautify-html": {
"wrap_attributes": "force-aligned"
// #vue組件中html代碼格式化樣式
}
},
"vetur.format.defaultFormatter.html": "prettier",
"vetur.format.defaultFormatter.css": "prettier",
"vetur.format.defaultFormatter.postcss": "prettier",
"vetur.format.defaultFormatter.scss": "prettier",
"vetur.format.defaultFormatter.less": "prettier",
"vetur.format.defaultFormatter.stylus": "stylus-supremacy",
"vetur.format.defaultFormatter.js": "prettier",
"vetur.format.defaultFormatter.ts": "prettier",
"editor.formatOnPaste": true,
"editor.multiCursorModifier": "ctrlCmd",
"editor.snippetSuggestions": "top",
"files.autoSave": "afterDelay",
"window.zoomLevel": 0,
"extensions.ignoreRecommendations": false,
"search.location": "sidebar",
"javascript.updateImportsOnFileMove.enabled": "always",
"files.associations": {
".html": "html",
".vue": "vue",
".cjson": "jsonc",
".wxss": "css",
"*.wxs": "javascript"
},
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"emmet.includeLanguages": {
"wxml": "html"
},
"minapp-vscode.disableAutoConfig": true,
"[javascript]": {
"editor.defaultFormatter": "vscode.typescript-language-features"
}
}
安裝node.js
安裝完成後，在命令行輸入node -v 檢測是否安裝成功
安裝vue-cli
命令行 npm install -g @vue/cli
安裝完成後使用 vue -V 或者 vue --version 查看版本是否正確
全局安裝nrm包，nrm是npm源管理器
命令行 npm i -g nrm
命令行 使用 nrm test 檢測鏡像到你本地的速度
命令行 nrm use taobao 選擇一個速度快的，切換過去，這裏是切換到taobao源