Code Review 时如何统一团队的代码风格？

这问题太典型了，ESLint 和 Prettier 打架简直是每个团队的必经之路。

说下核心原则：ESLint 只管代码质量，Prettier 只管代码格式，各司其职别越界。

直接给你一套能跑的配置，复制过去试试。

先装依赖：

npm install -D eslint prettier eslint-config-prettier eslint-plugin-prettier

然后是 .eslintrc.js，关键是把 prettier 放在 extends 最后：

module.exports = {

  extends: [

    'eslint:recommended',

    'plugin:prettier/recommended'  // 这个必须放最后，会关掉所有和 prettier 冲突的规则

  ],

  rules: {

    // 只保留代码质量相关的规则，格式化的别写这里

    'no-unused-vars': 'warn',

    'no-console': 'off'

  }

}

.prettierrc 配置：

{

  "semi": true,

  "singleQuote": true,

  "tabWidth": 2,

  "trailingComma": "none",

  "printWidth": 100

}

光这样还不够，肯定有人提交前忘了格式化。上 husky + lint-staged 自动搞定：

npm install -D husky lint-staged

npx husky install

npx husky add .husky/pre-commit "npx lint-staged"

package.json 里加这段：

{

  "lint-staged": {

    "*.{js,jsx,ts,tsx}": [

      "prettier --write",

      "eslint --fix"

    ]

  }

}

这样每次 git commit 的时候会自动格式化，不合规的根本提交不上去。

关于分号加不加的问题，团队投票定一个就行，写进 .prettierrc 就完事了，别在 CR 里争论这种事，浪费时间。我们团队选了加分号，因为老项目多，改起来成本太大。

对了，VSCode 用户记得装 Prettier 插件，再在项目根目录建个 .vscode/settings.json：

{

  "editor.formatOnSave": true,

  "editor.defaultFormatter": "esbenp.prettier-vscode"

}

这样保存时自动格式化，想写不规范都难。

我之前也遇到过这破事，ESLint 和 Prettier 打架是经典问题了。

解决方案很简单：Prettier 管格式化，ESLint 管代码质量，装个 eslint-config-prettier 把 ESLint 里跟格式相关的规则全关掉，别让两边抢活干。然后配上 husky 和 lint-staged，提交代码时自动格式化，谁都不用操心。

// package.json

{

  "scripts": {

    "lint": "eslint src --fix",

    "format": "prettier --write src/**/*.{js,jsx,ts,tsx}"

  },

  "lint-staged": {

    "*.{js,jsx,ts,tsx}": [

      "prettier --write",

      "eslint --fix"

    ]

  }

}

// .eslintrc.js

module.exports = {

  extends: [

    'eslint:recommended',

    'plugin:prettier/recommended'  // 这个一定要放最后

  ]

}

// .prettierrc

{

  "semi": true,

  "singleQuote": true,

  "tabWidth": 2,

  "trailingComma": "es5"

}

团队里谁爱加分号谁不爱加都闭嘴，prettierrc 里定死就行，git commit 时自动统一，argue 的时间都能多写几行代码了。