VSCode如何配置以符合公司的编码规范

2次阅读

vscode可通过ESLint、Pretterr和EditorConfig等插件配合.eslintrc、.prettierrc、.editorconfig及.vscode/settings.json三层配置,实现代码规范的自动检查、格式化与团队统一落地。

VSCode如何配置以符合公司的编码规范

VSCode 本身不强制任何编码规范,但通过合理配置插件、设置和规则文件,可以自动检查、格式化并约束代码风格,让开发行为贴合公司统一标准。

安装核心插件

这些插件是落地编码规范的基础工具:

  • ESLint:用于 javaScript/typescript 的静态检查,支持自定义规则(如禁用 var、要求缩进为 2 空格、函数命名必须小驼峰等)
  • Prettier:专注代码格式化(换行、引号、括号位置等),可与 ESLint 协同,避免规则冲突
  • EditorConfig for VS Code:读取项目根目录的 .editorconfig 文件,统一基础编辑行为(如字符编码、行尾符、缩进风格)
  • 对应语言插件(如 pythongoC#):提供语法高亮、智能提示及语言专属 Linter 支持

配置项目级规则文件

把规范“写进文件”,而非只靠口头传达。常见做法:

  • 在项目根目录放 .eslintrc.js.eslintrc.json继承公司统一的 ESLint 配置包(如 @company/eslint-config-base
  • 添加 .prettierrc 明确格式细节,例如:{“semi”: false, “singleQuote”: true, “tabWidth”: 2}
  • 配置 .editorconfig 统一基础编辑习惯:indent_style = spaceindent_size = 2end_of_line = lf
  • 若使用 TypeScript,确保 tsconfig.json 中开启 “strict”: true 及公司要求的检查项(如 “noImplicitAny”

调整 VSCode 设置(推荐工作区设置)

在项目根目录的 .vscode/settings.json 中配置,确保团队成员开箱即用:

VSCode如何配置以符合公司的编码规范

AI Code Reviewer

AI自动审核代码

VSCode如何配置以符合公司的编码规范 112

查看详情 VSCode如何配置以符合公司的编码规范

  • 启用保存时自动修复:“editor.codeActionsOnSave”: {“source.fixAll.eslint”: true}
  • 设 Prettier 为默认格式化工具:“editor.defaultFormatter”: “esbenp.prettier-vscode”
  • 关闭可能干扰的格式化选项:“editor.formatOnSave”: true,但禁用 “editor.formatOnType”(避免输入中途乱跳)
  • 指定文件关联格式器,例如:“[javascript]”: {“editor.defaultFormatter”: “esbenp.prettier-vscode”}

验证与持续保障

配置不是一劳永逸,需验证是否真正生效:

  • 手动触发格式化(Shift+Alt+F)或保存后观察代码变化
  • 故意写一条违规代码(如用双引号、多一个空格),看 ESLint 是否标红并给出修复建议
  • 在终端运行 npx eslint . –ext .js,.ts 检查全量问题,确认规则加载正确
  • 把配置文件纳入 git,配合 CI(如 github Actions)在提交前校验,防止本地漏配

基本上就这些。关键不是砌插件,而是用 .eslintrc + .prettierrc + .vscode/settings.json 三层联动,把公司规范变成可执行、可验证、不依赖个人记忆的自动化流程。

text=ZqhQzanResources