vscode格式化配置
安装插件
- ESlint
- vetur
- vscode-icons
- Bracket Pair Colorizer
- Beautify
- Document This
1 2 5必须装
最新的版本
// {
// "editor.suggestSelection": "first",
// "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue"
// }
// {
// "editor.suggestSelection": "first",
// "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue"
// }
{
// "files.exclude": {
// "node_modules/": true
// },
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": false,
// 重新设定tabsize
"editor.tabSize": 4,
// #每次保存的时候自动格式化
"editor.formatOnSave": true,
// #去掉代码结尾的分号
"prettier.semi": false,
// #使用带引号替代双引号
"prettier.singleQuote": true,
// #让函数(名)和后面的括号之间加个空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
// #这个按用户自身习惯选择
// "vetur.format.defaultFormatter.html": "js-beautify-html",
// #让vue中的js按编辑器自带的ts格式进行格式化
"vetur.format.defaultFormatter.js": "vscode-typescript",
"vetur.format.defaultFormatterOptions": {
"prettier": {
"semi": false, //不加分号
"singleQuote": true, //用单引号
"trailingComma": "none" // 不使用拖尾逗号
}, // 重写prettier配置，与eslint保持一致
"js-beautify-html": {
"wrap_line_length": 120,
"wrap_attributes": "auto"
// #vue组件中html代码格式化样式
}
},
// "eslint.autoFixOnSave": true,
// 格式化stylus, 需安装Manta's Stylus Supremacy插件
"stylusSupremacy.insertColons": false, // 是否插入冒号
"stylusSupremacy.insertSemicolons": false, // 是否插入分号
"stylusSupremacy.insertBraces": false, // 是否插入大括号
"stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
"stylusSupremacy.insertNewLineAroundBlocks": false,
"explorer.confirmDelete": false, // 两个选择器中是否换行
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"files.autoSave": "afterDelay",
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"diffEditor.ignoreTrimWhitespace": false,
"atomKeymap.promptV3Features": true,
"editor.multiCursorModifier": "ctrlCmd",
"editor.formatOnPaste": true,
"guides.enabled": false,
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
"git.autofetch": true,
"explorer.confirmDragAndDrop": false,
"terminal.integrated.tabs.enabled": true,
"workbench.colorCustomizations": {
"[Quiet Light]": {
"editor.foreground": "#201515",
"editor.selectionHighlightBorder": "#94767c00",
"editor.selectionHighlightBackground": "#ff000078",
"editorIndentGuide.activeBackground": "#81868d",
"editorBracketMatch.background": "#ca9fdb5e",
"editorBracketMatch.border": "#ff0000",
"tab.activeBackground": "#ad9cd4b2",
"textLink.foreground": "#d6561ac4",
"descriptionForeground": "#ff0000",
"selection.background": "#b98cd693",
"textBlockQuote.background": "#b89a9a",
"textSeparator.foreground": "#86c2df"
}
},
"editor.tokenColorCustomizations": {
"[Quiet Light]": {
"comments": "#7e3648",
"strings": "#519657",
"functions": "#7e57c2",
"keywords": "#8e1da1",
"variables": "#e57373",
"numbers": "#e62020",
"textMateRules": [
{
"name": "Comment",
"scope": ["comment"],
"settings": {
"foreground": "#a7cca8",
"fontStyle": ""
}
},
{
"name": "[VSCODE-CUSTOM] PHP Punctuation Variable Definition",
"scope": "punctuation.definition.variable.php",
"settings": {
"foreground": "#e57373"
}
},
{
"name": "String",
"scope": ["string"],
"settings": {
"foreground": "#32a504",
"fontStyle": ""
}
},
{
"name": "HTML:Tags",
"scope": [
"meta.tag",
"punctuation.definition.tag.html",
"punctuation.definition.tag.begin.html",
"punctuation.definition.tag.end.html"
],
"settings": {
"foreground": "#4b4444",
"fontStyle": ""
}
},
{
"name": "HTML:Tag Names",
"scope": "entity.name.tag",
"settings": {
"foreground": "#a617e9",
"fontStyle": ""
}
},
{
"name": "HTML: Attribute Names",
"scope": [
"meta.tag entity.other.attribute-name",
"entity.other.attribute-name.html"
],
"settings": {
"fontStyle": "italic",
"foreground": "#f31616"
}
},
{
"name": "Operator",
"scope": "keyword.operator",
"settings": {
"foreground": "#e21d1d",
"fontStyle": ""
}
}
]
}
},
"encourager.yourName": "~",
"encourager.encouragePageDelay": 30,
"encourager.newCharacters": [
{
"id": 5,
"data": [
{
"say": "",
"img": "https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fn.sinaimg.cn%2Ffront%2F199%2Fw600h399%2F20181006%2F9FFL-hktxqah7917384.jpg&refer=http%3A%2F%2Fn.sinaimg.cn&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1626858877&t=044af6ebe78ff17aad8bfec9e2e47078"
}
]
}
],
"php.validate.executablePath": "",
"security.workspace.trust.untrustedFiles": "open",
"workbench.iconTheme": "material-icon-theme",
"[html]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"files.exclude": {
"**/.classpath": true,
"**/.factorypath": true,
"**/.project": true,
"**/.settings": true
},
"read-book-status-bar.name": "完美世界",
"read-book-status-bar.link": "https://www.xbiquge.so/book/8/",
"backgroundCover.opacity": 0,
"git.ignoredRepositories": ["**/target"],
"z-reader.onlineSite": "笔趣阁",
"eslint.autoFixOnSave": true,
"bracketPairColorizer.depreciation-notice": false
}
旧版本
// {
// "editor.suggestSelection": "first",
// "vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue"
// }
{
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": false,
// 重新设定tabsize
"editor.tabSize": 4,
// #每次保存的时候自动格式化
"editor.formatOnSave": true,
// #每次保存的时候将代码按eslint格式进行修复
"eslint.autoFixOnSave": true,
// #去掉代码结尾的分号
"prettier.semi": false,
// #使用带引号替代双引号
"prettier.singleQuote": true,
// #让函数(名)和后面的括号之间加个空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
// #这个按用户自身习惯选择
"vetur.format.defaultFormatter.html": "js-beautify-html",
// #让vue中的js按编辑器自带的ts格式进行格式化
"vetur.format.defaultFormatter.js": "vscode-typescript",
// "vetur.format.defaultFormatterOptions": {
// "js-beautify-html": {
// "wrap_line_length": 120,
// "wrap_attributes": "auto"
// // #vue组件中html代码格式化样式
// }
// },
// 格式化stylus, 需安装Manta's Stylus Supremacy插件
"stylusSupremacy.insertColons": false, // 是否插入冒号
"stylusSupremacy.insertSemicolons": false, // 是否插入分号
"stylusSupremacy.insertBraces": false, // 是否插入大括号
"stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
"stylusSupremacy.insertNewLineAroundBlocks": false,
"explorer.confirmDelete": false, // 两个选择器中是否换行
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"workbench.iconTheme": "vscode-icons",
"files.autoSave": "off",
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"diffEditor.ignoreTrimWhitespace": false,
"window.zoomLevel": 0,
"atomKeymap.promptV3Features": true,
"editor.multiCursorModifier": "ctrlCmd",
"editor.formatOnPaste": true,
"guides.enabled": false,
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
"git.autofetch": true,
}
很久的版本
{ //背景主题
"workbench.iconTheme": "vscode-icons",
//背景主题
"workbench.colorTheme": "One Dark Pro",
// 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": [
"vue",
"html",
"javascript",
"typescript",
"javascriptreact",
"typescriptreact"
],
// vetur 的自定义设置
"vetur.format.defaultFormatterOptions": {
"prettier": {
"singleQuote": true,
"semi": false
}
},
// vue 扩展的文件默认使用 prettier 进行格式化
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
}
很旧很旧的版本
setting.json
// vscode默认启用了根据文件类型自动设置tabsize的选项
"editor.detectIndentation": false,
// 重新设定tabsize
"editor.tabSize": 4,
// #每次保存的时候自动格式化
"editor.formatOnSave": true,
// #每次保存的时候将代码按eslint格式进行修复
"eslint.autoFixOnSave": true,
// #去掉代码结尾的分号
"prettier.semi": false,
// #使用带引号替代双引号
"prettier.singleQuote": true,
// #让函数(名)和后面的括号之间加个空格
"javascript.format.insertSpaceBeforeFunctionParenthesis": true,
// #这个按用户自身习惯选择
"vetur.format.defaultFormatter.html": "js-beautify-html",
// #让vue中的js按编辑器自带的ts格式进行格式化
"vetur.format.defaultFormatter.js": "vscode-typescript",
// "vetur.format.defaultFormatterOptions": {
// "js-beautify-html": {
// "wrap_line_length": 120,
// "wrap_attributes": "auto"
// // #vue组件中html代码格式化样式
// }
// },
// 格式化stylus, 需安装Manta's Stylus Supremacy插件
"stylusSupremacy.insertColons": false, // 是否插入冒号
"stylusSupremacy.insertSemicolons": false, // 是否插入分号
"stylusSupremacy.insertBraces": false, // 是否插入大括号
"stylusSupremacy.insertNewLineAroundImports": false, // import之后是否换行
"stylusSupremacy.insertNewLineAroundBlocks": false,
"explorer.confirmDelete": false, // 两个选择器中是否换行
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"workbench.iconTheme": "vscode-icons",
"files.autoSave": "off",
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"diffEditor.ignoreTrimWhitespace": false,
"window.zoomLevel": 0,
"atomKeymap.promptV3Features": true,
"editor.multiCursorModifier": "ctrlCmd",
"editor.formatOnPaste": true,
"guides.enabled": false,
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
