前言
配图源自 Freepik
作为一个 JSer，可用于前端开发的工具实在是太多了，像 Atom、WebStorm、HBuilder、Sublime Text 3 等等等......可独爱 VS Code。讲真的，除了刚开始接触前端时用过 Sublime Text 来写代码，后面发现 VS Code 之后，就没换过编辑器了...
Anyway，哪个舒服用哪个，一搬砖工具而已，哈哈。但「工欲善其事，必先利其器」。
为此，本文会记录一些 VS Code 常用且建议的配置，并及时、持续地更新以适应最新版本，也会移除一些废弃的配置项。它更新得实在太频繁了...
并添加了详细的标注说明...
正文
配置
{ // 工作区相关 "workbench.iconTheme": "material-icon-theme", // 文件图标主题：Material Icon Theme // 编辑器相关 "editor.trimAutoWhitespace": false, // 删除自动插入的尾随空白符号 "editor.codeActionsOnSave": { // 在保存时运行的代码操作类型 "source.fixAll.eslint": true }, "editor.formatOnSave": true, // 在保存时格式化文件 "editor.defaultFormatter": "esbenp.prettier-vscode", // 定义默认格式化程序，这里指定了 Prettier。 "editor.minimap.enabled": false, // 是否显示缩略图 "editor.bracketPairColorization.enabled": true, // 启用括号对着色，自 version 1.60 起开始支持。 "editor.suggest.preview": true, // 控制是否在编辑器中预览建议结果 // 文件相关 "files.trimTrailingWhitespace": true, // 保存文件时删除文件末尾的空白格 "files.associations": { // 配置语言的文件关联 "*.wxss": "css", "*.acss": "css", "*.wxs": "javascript", "*.sjs": "javascript", "*.axml": "html", "*.wxml": "html", "*.swan": "html", "*.vue": "vue" }, "files.exclude": { // 文件资源管理器根据此设置决定要显示或隐藏的文件和文件夹 "**/.git": true, "**/.svn": true, "**/.hg": true, "**/CVS": true, "**/.DS_Store": true }, // 搜索相关 // 在使用搜索功能时，默认将这些文件夹/文件排除在外。 // 设置之后可在搜索框下切换“齿轮+减号”的图标来是否执行此选项 "search.exclude": { "**/node_modules": true, "**/bower_components": true }, // ESLint 相关 "eslint.workingDirectories": [{ "mode": "auto" }], // 指示 ESLint 根据 package.json、.eslintignore 和 .eslintrc* 文件的位置推断工作目录。 "eslint.options": { // 更多详见 https://eslint.cn/docs/developer-guide/nodejs-api#cliengine "extensions": [".js", ".ts", "jsx", ".tsx"] // 要检查的文件扩展名的数组 }, "eslint.validate": ["javascript", "javascriptreact", "vue", "typescript", "typescriptreact"] // 指定 ESLint 可识别的语言数组，未安装 ESLint 插件时将显示错误。 // Prettier 相关，需配合 editor.formatOnSave 使用 // 当没有显式指定配置文件时，插件中的配置项将作为后备。 // 相反地，如果存在任何本地配置文件，将不会使用 VS Code 插件的配置。 // 更多：https://github.com/toFrankie/lint-config-custom/blob/main/docs/usage-prettier.md "prettier.printWidth": 120, "prettier.semi": false, "prettier.arrowParens": "avoid", "prettier.singleQuote": true, "prettier.trailingComma": "none", }
