怎样在VSCode中配置代码格式化规则？-VSCode-PHP中文网

怎样在VSCode中配置代码格式化规则？

夢幻星辰

发布： 2025-10-17 17:18:01

原创

307人浏览过

配置VSCode代码格式化需启用保存时自动格式化，选择合适工具如Prettier或ESLint，并在项目中使用配置文件统一风格。

怎样在vscode中配置代码格式化规则？

在 VSCode 中配置代码格式化规则，关键是结合编辑器设置、语言扩展和项目级配置文件。只要正确设置，保存时就能自动按规则格式化代码。

启用保存时自动格式化

最基础的一步是开启保存即格式化的功能，避免手动操作：

打开 VSCode 设置（Ctrl + ,）
搜索 format on save
勾选 Editor: Format On Save

也可以在 settings.json 中手动添加：

"editor.formatOnSave": true

选择合适的格式化工具

不同语言需要对应的格式化程序。常见语言推荐使用以下工具：

JavaScript/TypeScript：使用 Prettier 或 ESLint 内建格式化
Python：安装 Pylance 扩展，并配置 black、autopep8 或 yapf
HTML/CSS/JSON：Prettier 支持良好

安装对应扩展后，在命令面板（Ctrl + Shift + P）输入 “Format Document With” 可选择默认格式化工具。

项目级配置文件示例

为了团队统一风格，建议在项目根目录添加配置文件。

讯飞智作-讯飞配音

讯飞智作是一款集AI配音、虚拟人视频生成、PPT生成视频、虚拟人定制等多功能的AI音视频生产平台。已广泛应用于媒体、教育、短视频等领域。

查看详情

以 Prettier 为例，创建 .prettierrc 文件：

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

同时添加 .prettierignore 忽略特定文件：

node_modules dist *.min.js

配合 ESLint 使用（前端项目推荐）

若使用 ESLint，可让其接管格式化，避免冲突：

安装 ESLint 扩展
在 settings.json 中设置：

"editor.defaultFormatter": "dbaeumer.vscode-eslint", "editor.formatOnSave": false, "eslint.format.enable": true, "editor.codeActionsOnSave": { "source.fixAll.eslint": true }

这样 ESLint 会在保存时自动修复可修复的问题，包括格式问题。

基本上就这些。关键是根据项目技术栈选择合适工具，并统一配置。多人协作时，把配置提交到仓库能减少风格争议。

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

大家都在看：

VSCode Docker开发_容器化编码环境搭建 VSCode位置信息计算_文本坐标转换与定位算法 VSCode状态管理_扩展数据持久化策略 VSCode行尾序列_跨平台文件格式兼容 VSCode语言特性支持_实现语法高亮扩展