Prettier与ESLint可在VSCode中协同工作，Prettier负责代码格式化，ESLint专注代码质量检查。通过安装eslint-config-prettier和eslint-plugin-prettier避免规则冲突，并在.eslintrc配置中引入plugin:prettier/recommended。同时在VSCode的settings.json中设置Prettier为默认格式化工具，开启保存时自动格式化和ESLint自动修复，实现编辑时实时提示、保存时统一格式，提升开发效率与团队协作一致性。
Prettier 和 ESLint 在 VSCode 中可以很好地协同工作，各自负责不同的职责：Prettier 负责代码格式化，ESLint 负责代码质量和潜在错误的检查。通过合理配置，两者不会冲突，反而能提升开发体验。
1. 明确分工：Prettier 格式化，ESLint 检查逻辑
为了协同工作，首先要让工具各司其职：
- Prettier：专注代码样式（如引号、分号、换行、缩进等）
- ESLint：专注代码质量（如未使用变量、潜在 bug、命名规范等）
避免 ESLint 重复管理格式问题，可通过插件禁用与 Prettier 冲突的规则。
2. 安装必要插件和依赖
在项目中安装以下 npm 包：
npm install --save-dev eslint prettier eslint-config-prettier eslint-plugin-prettier其中：
- eslint-config-prettier：关闭所有与 Prettier 冲突的 ESLint 规则
- eslint-plugin-prettier：将 Prettier 作为 ESLint 规则运行，格式错误会显示在 ESLint 提示中
同时确保 VSCode 安装了以下扩展：
- ESLint（由 Microsoft 提供）
- Prettier - Code formatter
3. 配置 ESLint 使用 Prettier
在项目根目录的 .eslintrc.js 或 .eslintrc.json 中添加：
Git版本控制与工作流 中文WORD版
下载
篇文章是针对git版本控制和工作流的总结，如果有些朋友之前还没使用过git，对git的基本概念和命令不是很熟悉，可以从以下基本教程入手： Git是分布式版本控制系统，与SVN类似的集中化版本控制系统相比，集中化版本控制系统虽然能够令多个团队成员一起协作开发，但有时如果中央服务器宕机的话，谁也无法在宕机期间提交更新和协同开发。甚至有时，中央服务器磁盘故障，恰巧又没有做备份或备份没及时，那就可能有丢失数据的风险。感兴趣的朋友可以过来看看
这样会自动启用 prettier/recommended，整合 Prettier 并应用 eslint-config-prettier 来消除冲突。
4. 配置 VSCode 默认格式化工具
在 VSCode 的 settings.json 中设置：
{ "[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[typescript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[json]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "editor.formatOnSave": true, "editor.codeActionsOnSave": { "source.fixAll.eslint": true } }说明：
- 保存文件时自动用 Prettier 格式化
- 同时触发 ESLint 自动修复可修复的问题（如缺少分号、空格等）
注意：开启 source.fixAll.eslint 后，ESLint 会调用 Prettier（如果已集成），实现统一处理。
基本上就这些。配置完成后，你在编辑代码时既能获得 ESLint 的质量提示，又能享受 Prettier 带来的统一格式，保存即自动整理，团队协作更顺畅。
