1.安装3个插件 ESlint, Prettier - Code formatter ,Vetur
2.编辑设置文件，替换以下内容
{
// 左侧目录不折叠
"explorer.compactFolders": false,
// #每次保存的时候自动格式化
"editor.formatOnSave": true,
"editor.fontSize": 14,
"editor.tabSize": 4,
// 代码提示顺序
"editor.snippetSuggestions": "top",
// 选择格式化工具
"[jsonc]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[less]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[html]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
// prettier配置
"prettier": {
// 句尾添加分号
"semi": false,
// 缩进字节数
"tabWidth": 4,
// 超过最大值换行
"printWidth": 500,
// 使用单引号代替双引号
"singleQuote": true
},
// vetur配置
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "auto" // 设置为“force-aligned”，效果会不一样
},
"prettier": {
"semi": false, // 不加分号
"singleQuote": true, // 用单引号
"tabWidth": 2, // tab缩进空格个数
"trailingComma": "none", // 禁止在末尾加逗号
"printWidth": 200 // 每行宽达到200才强制换行
}
}
}