国产叼嘿久久精品久久,久久综合久久久,久久婷婷五月综合97色直播

vscode中vue文件保存時怎么自動格式化？下面本篇文章給大家介紹一下vscode保存按照eslint規則自動格式化的方法，希望對大家有所幫助！

淺析vscode中vue文件保存時怎么自動格式化

最近寫vue用了vue-admin-template，npm run dev跑起來總是有eslint報錯，每次檢查耗時耗力，記錄解決方法。【推薦學習：《vscode》】

1.安裝插件

vscode安裝以下插件：

eslint
Vetur
Prettier – Code formatter

2.vue文件保存時格式化

按住·commond+shift+p·，搜索 perferences open setting(json)。

立即學習“前端免費學習筆記（深入）”；

淺析vscode中vue文件保存時怎么自動格式化

在配置文件中添加以下內容，注意不要直接所有拷貝進去，可能會覆蓋到你自己的配置。建議拷貝進去然后去除重復的key即可。

{  "editor.suggestSelection":?"first",  "vsintellicode.modify.editor.suggestSelection":?"automaticallyOverrodeDefaultValue",  "explorer.confirmDelete":?false,  "editor.tabSize":?2,  "files.autoSave":?"onFocusChange",  "editor.fontSize":?14,?//?設置字體  "editor.tabCompletion":?"on",?//?用來在出現推薦值時，按下Tab鍵是否自動填入最佳推薦值  "editor.codeActionsOnSave":?{  "source.fixAll.eslint":?true,  "source.organizeImports":?true?//?這個屬性能夠在保存時，自動調整?import?語句相關順序，能夠讓你的?import?語句按照字母順序進行排列  },  "editor.formatOnSave":?true,  //?#讓vue中的js按"prettier"格式進行格式化  "vetur.format.defaultFormatter.html":?"js-beautify-html",  "vetur.format.defaultFormatter.js":"prettier-eslint",  "vetur.format.defaultFormatterOptions":?{  "js-beautify-html":?{  //?#vue組件中html代碼格式化樣式  "wrap_attributes":?"auto",?//也可以設置為“auto”，效果會不一樣  "wrap_line_length":?200,  "end_with_newline":?false,  "semi":?false,  "singleQuote":?true  },  "prettier":?{  "semi":?false,  "singleQuote":?true,  "editor.tabSize":?2  },  "prettyhtml":?{  "printWidth":?160,  "singleQuote":?false,  "wrapAttributes":?false,  "sortAttributes":?false  }  },  "[vue]":?{  "editor.defaultFormatter":?"octref.vetur"  },  "bracketPairColorizer.depreciation-notice":?false,  "editor.mouseWheelZoom":?true  }