一、安裝常用插件：
Ctrl+shift+x打開應用商店搜索這幾個插件安裝即可
Beautify、Eslint、Vetur
二、setting.josn配置
檔案-首選項-設定-在setting.josn中編輯，打開這個setting.josn檔案后將下面配置復制即可
{ // tab 大小為2個空格 "editor.tabSize": 2, // 100 列后換行 "editor.wordWrapColumn": 100, // 保存時格式化 "editor.formatOnSave": true, // 開啟 vscode 檔案路徑導航 "breadcrumbs.enabled": true, // prettier 設定陳述句末尾不加分號 "prettier.semi": false, // prettier 設定強制單引號 "prettier.singleQuote": true, // 選擇 vue 檔案中 template 的格式化工具 "vetur.format.defaultFormatter.html": "prettyhtml", // 顯示 markdown 中英文切換時產生的特殊字符 "editor.renderControlCharacters": true, // 設定 eslint 保存時自動修復 "eslint.autoFixOnSave": true, // eslint 檢測檔案型別 "eslint.validate": [ "javascript", "javascriptreact", { "language": "html", "autoFix": true }, { "language": "vue", "autoFix": true } ], // vetur 的自定義設定 "vetur.format.defaultFormatterOptions": { "prettier": { "singleQuote": true, "semi": false } }, // 修改500ms后自動保存 "editor.formatOnSaveTimeout": 500, "files.autoSave": "afterDelay", "files.autoSaveDelay": 500, "editor.codeActionsOnSaveTimeout": 500, "[javascript]": { "editor.defaultFormatter": "vscode.typescript-language-features" } }
三、配置.editorconfig檔案
專案根目錄下找到.editorconfig這個檔案，然后復制下面配置即可
# https://editorconfig.org root = true # 根目錄的組態檔，編輯器會由當前目錄向上查找，如果找到 `roor = true` 的檔案，則不再查找 [*] # 匹配所有的檔案 indent_style = space # 空格縮進 indent_size = 4 # 縮進空格為4個 end_of_line = lf # 檔案換行符是 linux 的 `\n` charset = utf-8 # 檔案編碼是 utf-8 trim_trailing_whitespace = true # 不保留行末的空格 insert_final_newline = true # 檔案末尾添加一個空行 curly_bracket_next_line = false # 大括號不另起一行 spaces_around_operators = true # 運算子兩遍都有空格 indent_brace_style = 1tbs # 條件陳述句格式是 1tbs [*.js] # 對所有的 js 檔案生效 quote_type = single # 字串使用單引號 [*.{html,less,css,json}] # 對所有 html, less, css, json 檔案生效 quote_type = double # 字串使用雙引號 [package.json] # 對 package.json 生效 indent_size = 2 # 使用2個空格縮進
注釋都寫了， 我就不再啰嗦，實屬干貨，上手試試吧！
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/5408.html
標籤：HTML5