vscode的格式化问题
Posted 郭郭郭牧鑫
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vscode的格式化问题相关的知识,希望对你有一定的参考价值。
vscode的格式化问题
一、先下载插件
在插件商店中下载三个插件
Beautify、Eslint、Vetur
二、在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文件
#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个空格缩进
以上是关于vscode的格式化问题的主要内容,如果未能解决你的问题,请参考以下文章