首先设置vscode默认格式化工具并启用保存自动格式化，接着在项目中配置.prettierrc和.editorconfig文件统一团队代码风格，最后集成ESLint与Prettier协同工作确保JavaScript/typescript代码一致性。

VSCode 的代码格式化配置可以帮助你保持代码风格统一，提升可读性。关键在于正确设置编辑器默认格式化工具，并结合项目级配置文件实现团队协作一致。

启用并设置默认格式化工具

确保 VSCode 使用你喜欢的格式化程序，比如 Prettier、ESLint 或 Beautify：

• 打开设置（Ctrl + , 或菜单 File > Preferences > Settings）
• 搜索 “default formatter”
• 选择对应语言的格式化工具，例如使用 Prettier 时设为 esbenp.prettier-vscode
• 勾选 “Format On Save”，保存时自动格式化

配置项目级 .prettierrc 和 .editorconfig

在项目根目录添加配置文件，保证团队成员格式统一：

代码小浣熊

代码小浣熊是基于商汤大语言模型的软件智能研发助手，覆盖软件需求分析、架构设计、代码编写、软件测试等环节

51

查看详情

• 创建 .prettierrc 文件定义格式规则：

  <font face="Courier New">{   "semi": true,   "trailingComma": "es5",   "singleQuote": true,   "printWidth": 80,   "tabWidth": 2 }</font>
• 添加 .editorconfig 补充基础编辑行为：

  <font face="Courier New">root = true  [*] indent_style = space indent_size = 2 end_of_line = lf charset = utf-8 trim_trailing_whitespace = true insert_final_newline = true</font>

结合 ESLint 自动修复（适用于 JavaScript/TypeScript）

若使用 ESLint，可通过插件与 Prettier 协同工作：

• 安装依赖：npm install –save-dev eslint-config-prettier eslint-plugin-prettier
• 在 .eslintrc.js 中启用：

  <font face="Courier New">extends: [   'eslint:recommended',   'plugin:prettier/recommended' ]</font>
• VSCode 安装 ESLint 插件（dbaeumer.vscode-eslint）
• 设置 ESLint 为默认格式化提供者之一，避免冲突

基本上就这些。合理组合编辑器设置和项目配置，就能实现高效、一致的代码格式化。