插件
- Vue-Official
- any-rule
- Auto Close Tag
- Auto Rename Tag
- Beautify css/sass/scss/less
- Chinese (Simplified) (简体中文)
- Color Highlight
- Dart
- ES7 React/Redux/GraphQL/React-Native snippets
- ESlint
- Figma for VS Code
- Flutter
- Git Graph
- Git History
- GitLens-Git supercharged
- Go
- Highlight Matching Tag
- HTML CSS Support
- IntelliSense for CSS class names in HTML
- Path Intellisense
- Prettier - Code formatter
- Simple React Snippets
- Typescript React code snippets
- Vue 3 Snippets
- Vue VSCode Snippets
- Vuter
配置
// {
// "workbench.preferredDarkColorTheme": "Visual Studio Dark",
// "search.followSymlinks": false,
// "git.autorefresh": false,
// "editor.tabSize": 2,
// "[dart]": {
// "editor.formatOnSave": true,
// "editor.formatOnType": true,
// "editor.rulers": [
// 80
// ],
// "editor.selectionHighlight": false,
// "editor.suggestSelection": "first",
// "editor.tabCompletion": "onlySnippets",
// "editor.wordBasedSuggestions": "off"
// },
// // 前端格式化
// "editor.formatOnSave": true,
// "eslint.enable": true, // 开启eslint检查
// // ESLint只对javascript、typescript以及javascrpitreact进行代码格式化
// "[javascript]": {
// "editor.formatOnSave": false
// },
// "[javascriptreact]": {
// "editor.formatOnSave": false
// },
// "[typescript]": {
// "editor.formatOnSave": false
// },
// "editor.codeActionsOnSave": {
// "source.fixAll.eslint": true
// },
// "eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact", "vue", "html"],
// "prettier.requireConfig": true, // 必须要在项目根目录下添加配置文件
// "editor.defaultFormatter": "esbenp.prettier-vscode",
// }
// react
{
"workbench.preferredDarkColorTheme": "Visual Studio Dark",
"search.followSymlinks": false,
"git.autorefresh": false,
"[dart]": {
"editor.formatOnSave": true,
"editor.formatOnType": true,
"editor.rulers": [80],
"editor.selectionHighlight": false,
"editor.suggestSelection": "first",
"editor.tabCompletion": "onlySnippets",
"editor.wordBasedSuggestions": "off"
},
// 每次保存自动格式化
"editor.formatOnSave": true,
// 每次保存的时候将代码按eslint格式进行修复
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit"
},
"editor.defaultFormatter": "esbenp.prettier-vscode",
// vue文件默认格式化方式vetur
"[vue]": {
// "editor.defaultFormatter": "octref.vetur"
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// vetur格式化配置
"vetur.format.defaultFormatter.html": "js-beautify-html",
"vetur.format.options.tabSize": 2,
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "auto"
}
},
"vetur.format.defaultFormatter.js": "vscode-typescript", //让vue中的js按编辑器自带的ts格式进行格式化
"javascript.format.insertSpaceBeforeFunctionParenthesis": true, // 函数前加上空格 只有在默认vetur的时候生效
// js文件默认格式化方式 和vue中的js保持一致使用编辑器自带的ts格式
"[javascript]": {
// "editor.defaultFormatter": "vscode.typescript-language-features"
// javascript文件默认格式化方式prettier
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// json文件默认格式化方式prettier
"[json]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// css文件默认格式化方式prettier
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[less]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[scss]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// typescript文件默认格式化方式prettier
"[typescript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
// 控制折行方式 - "on" (根据视区宽度折行)
"editor.wordWrap": "on",
"editor.tabSize": 2, // 换行默认以tab缩进 2个字符
"editor.colorDecorators": false, // 控制编辑器是否显示内联颜色修饰器和颜色选取器。
"editor.snippetSuggestions": "top", // 将建议的代码段优先级提前选择,比如输入for第一个提示是for循环代码段。
"files.associations": {
// 文件关联语言的优先级配置
"*.js": "javascriptreact",
"*.vue": "vue",
"*.cshtml": "html",
"*.dwt": "html"
},
// "files.autoSave": "onFocusChange",
"editor.formatOnPaste": true
}
// vue
// {
// "[vue]": {
// // "editor.defaultFormatter": "rvest.vs-code-prettier-eslint"
// "editor.defaultFormatter": "octref.vetur"
// // "editor.defaultFormatter": "esbenp.prettier-vscode"
// },
// // 每次保存自动格式化
// "editor.formatOnSave": true,
// // 每次保存的时候将代码按eslint格式进行修复
// "editor.codeActionsOnSave": {
// "source.fixAll.eslint": true
// },
// // vue文件默认格式化方式vetur
// // vetur格式化配置
// "vetur.format.defaultFormatter.html": "js-beautify-html",
// "vetur.format.options.tabSize": 2,
// "vetur.format.defaultFormatterOptions": {
// "js-beautify-html": {
// "wrap_attributes": "auto", // 仅在超出行长度时才对属性进行换行
// // "wrap_attributes": "force", // 对除第一个属性外的其他每个属性进行换行
// // "wrap_attributes": "force-aligned", // 对除第一个属性外的其他每个属性进行换行,并保持对齐
// // "wrap_attributes": "force-expand-multiline", // 属性强制换行对齐
// // "wrap_attributes": "aligned-multiple", // 当超出折行长度时,将属性进行垂直对齐
// "wrap-line-length": 150 // 对每个属性进行换行
// }
// // "prettier": {
// // "singleQuote": false,
// // "semi": true,
// // }
// },
// // "vetur.format.defaultFormatter.js": "prettier-eslint", //让vue中的js按编辑器自带的ts格式进行格式化
// "vetur.format.defaultFormatter.js": "vscode-typescript", //让vue中的js按编辑器自带的ts格式进行格式化
// "javascript.format.insertSpaceBeforeFunctionParenthesis": true, // 函数前加上空格 只有在默认vetur的时候生效
// // js文件默认格式化方式 和vue中的js保持一致使用编辑器自带的ts格式
// "[javascript]": {
// // "editor.defaultFormatter": "vscode.typescript-language-features"
// // javascript文件默认格式化方式prettier
// "editor.defaultFormatter": "esbenp.prettier-vscode"
// },
// // json文件默认格式化方式prettier
// "[json]": {
// "editor.defaultFormatter": "esbenp.prettier-vscode"
// },
// // css文件默认格式化方式prettier
// "[css]": {
// "editor.defaultFormatter": "esbenp.prettier-vscode"
// },
// // typescript文件默认格式化方式prettier
// "[typescript]": {
// "editor.defaultFormatter": "esbenp.prettier-vscode"
// },
// // -----------------------其他自行配置-----------------------
// //关闭快速预览
// "editor.minimap.enabled": true,
// // 字体大小
// "editor.fontSize": 18,
// // 控制折行方式 - "on" (根据视区宽度折行)
// "editor.wordWrap": "on",
// "editor.tabSize": 2, // 换行默认以tab缩进 2个字符
// "editor.colorDecorators": false, // 控制编辑器是否显示内联颜色修饰器和颜色选取器。
// "editor.snippetSuggestions": "top", // 将建议的代码段优先级提前选择,比如输入for第一个提示是for循环代码段。
// "files.associations": {
// // 文件关联语言的优先级配置
// "*.vue": "vue",
// "*.cshtml": "html",
// "*.js": "javascript",
// "*.dwt": "html"
// },
// "workbench.editor.untitled.hint": "hidden",
// "explorer.confirmDelete": false,
// "editor.unicodeHighlight.ambiguousCharacters": false,
// "security.workspace.trust.untrustedFiles": "open",
// "window.zoomLevel": 1
// }