在setting.josn中编辑 安装Beautify、Eslint、Vetur
{
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": true,
// 重新设定tabsize
"editor.tabSize": 4,
// #每次保存的时候自动格式化
"editor.formatOnSave": false,
// #每次保存的时候将代码按eslint格式进行修复
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
// 添加 vue 支持
"eslint.validate": [
"javascript",
"javascriptreact",
"html",
"vue"
],
// #让函数(名)和后面的括号之间加个空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "force-aligned", // #vue组件中html代码格式化样式
"singleQuote": true, //双引号变单引号
"semi": true, //加分号
"tabWidth": 4,
"arrowParens": "avoid",
"bracketSpacing": true,
"proseWrap": "preserve" // 代码超出是否要换行 preserve保留
}
},
"vetur.format.defaultFormatter.html": "prettier",
"vetur.format.defaultFormatter.js": "prettier",
"vetur.format.defaultFormatter.less": "prettier",
//控制工作台底部状态栏的可见性
"workbench.statusBar.visible": true,
//控制工作台底部状态栏的可见性
"workbench.activityBar.visible": true,
//指定用在工作台中的颜色主题
"workbench.colorTheme": "Default Dark+",
//启用或禁用在 VS Code 中重命名或移动文件时自动更新导入路径的功能
"javascript.updateImportsOnFileMove.enabled": "always",
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
} // 两个选择器中是否换行
}
配置.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个空格缩进
