如何配置VSCode的代码格式化规则？

配置VSCode代码格式化需安装对应语言的格式化工具如Prettier或ESLint，设置默认格式化程序并启用保存时自动格式化，在项目根目录通过.prettierrc等配置文件定义具体规则，实现团队统一的代码风格自动化管理。

配置 VSCode 的代码格式化规则，核心是安装合适的格式化工具、设置默认格式化程序，并通过配置文件定义具体规则。只要正确设置，保存代码时就能自动按规范格式化。

安装格式化扩展

不同语言需要对应的格式化工具。常用扩展包括：

• Prettier：支持 J*aScript、TypeScript、CSS、HTML、JSON 等多种语言
• ESLint：主要用于 JS/TS，可集成格式化功能
• Black（Python）、gofmt（Go）等语言专用工具

在扩展商店搜索并安装所需插件，例如“Prettier - Code formatter”。

设置默认格式化程序

告诉 VSCode 使用哪个工具进行格式化：

• 右键编辑器空白处，选择“格式化文档”
• 若未设置默认程序，VSCode 会提示选择
• 点击后选择如 “Prettier” 作为默认

也可手动设置：打开设置（Ctrl+,），搜索 “Default Formatter”，为对应语言指定格式化工具。

启用保存时自动格式化

让代码在保存时自动格式化，提升效率：

• 打开设置，搜索 “format on s*e”
• 勾选 “Editor: Format On S*e”

也可以在 settings.json 中添加：

citySHOP 多用户商城

citySHOP是一款集CMS、网店、商品、系统，管理更加科学快速；全新Jquery前端引擎；智能缓存、图表化的数据分析，手机短信营销；各种礼包设置、搭配购买、关联等进一步加强用户体验；任何功能及设置都高度自定义；MVC架构模式，代码严禁、规范；商品推荐、促销、礼包、折扣、换购等多种设置模式；商品五级分类，可自由设置分类属性；商品展示页简介大方，清晰，图片自动放大，无需重开页面；商品评价、咨询分开

15 查看详情

{
  "editor.formatOnS*e": true
}

使用配置文件定义格式规则

项目级规则建议用配置文件管理，避免团队不一致。

以 Prettier 为例：

• 在项目根目录创建 .prettierrc 文件
• 写入自定义规则：

{
  "semi": false,
  "singleQuote": true,
  "tabWidth": 2,
  "trailingComma": "es5"
}

同时可添加 .prettierignore 忽略特定文件或目录。

ESLint 用户可在 .eslintrc.js 或 .eslintrc.json 中启用格式化规则，并确保 VSCode ESLint 扩展开启 auto-fix 功能。

基本上就这些。配置完成后，无需手动调整缩进或引号，代码风格自动统一。关键是选对工具、设好默认、配上规则文件。不复杂但容易忽略细节。

以上就是如何配置VSCode的代码格式化规则？的详细内容，更多请关注其它相关文章！