配置 VSCode 集成 Prettier 和 ESLint 可统一团队代码风格，提升可读性与维护性。首先安装 Prettier 扩展并创建 .prettierrc 定义格式规则，如分号、引号、行宽等；添加 .prettierignore 忽略无关文件。接着安装 ESLint 扩展并配置 .eslintrc.js，继承推荐规则并集成 Prettier，避免冲突。通过 npm 安装 eslint-config-prettier 和 eslint-plugin-prettier 确保协同工作。在 VSCode 设置中指定 Prettier 为默认格式化工具，启用保存时自动格式化，并通过 .vscode/settings.json 固化配置供团队共享。最后将配置文件提交至仓库，并在 package.json 添加 "format" 脚本实现一键格式化。一次配置，长期受益，保障代码整洁一致。
团队开发中，保持一致的代码风格能提升可读性、减少沟通成本。VSCode 通过集成 Prettier、ESLint 等工具，可以轻松实现代码格式化，统一编码规范。
安装并配置 Prettier
Prettier 是主流的代码格式化工具，支持 JavaScript、TypeScript、HTML、CSS、JSON 等多种语言。
说明： 先在 VSCode 扩展市场中搜索并安装 Prettier - Code formatter。项目根目录创建 .prettierrc 文件，定义格式化规则：
{
"semi": true,
"trailingComma": "es5",
"singleQuote": true,
"printWidth": 80,
"tabWidth": 2
}
也可添加 .prettierignore 忽略不需要格式化的文件，如 node_modules、dist 等。
结合 ESLint 提升代码质量
ESLint 能检查语法错误和风格问题，与 Prettier 配合使用更佳。
建议： 安装 ESLint 扩展，并在项目中配置 .eslintrc.js：module.exports = {
extends: ["eslint:recommended", "prettier"],
plugins: ["prettier"],
rules: {
"prettier/prettier": "error"
}
};
确保安装依赖：npm install --save-dev eslint eslint-config-prettier eslint-plugin-prettier
设置 VSCode 默认格式化工具
让 VSCode 在保存时自动格式化代码，减少手动操作。
打开 VSCode 设置（Ctrl + ,），搜索 Default Formatter，选择 Prettier。
启用保存时自动格式化：
- 文件 → 首选项 → 设置
- 勾选 Editor: Format On Save
也可在项目根目录添加 .vscode/settings.json，锁定团队配置：
{
"editor.defaultFormatter": "esbenp.prettier-vscode",
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
}
共享配置，确保一致性
将 .prettierrc、.eslintrc.js、.prettierignore 和 .vscode/settings.json 提交到版本仓库，让所有成员使用相同规则。
提示： 可在 package.json 添加脚本，方便批量格式化："scripts": {
"format": "prettier --write ."
}
运行 npm run format 即可格式化全部支持的文件。
基本上就这些。配置一次，全队受益，代码整洁又省心。不复杂但容易忽略细节，关键是把规则固化并共享。
