ESLint 和 Prettier 配合时为什么格式化冲突？

Newb.一涵提问于 2026-02-28 13:00:20 阅读 39

工具

我按照网上的教程配了 ESLint + Prettier，但保存文件时格式老是打架。比如 Prettier 想加个分号，ESLint 却报错说不能加分号，明明 .eslintrc 里已经关了这个规则。

我试过用 @eslint-config-prettier 关掉冲突规则，也装了 eslint-plugin-prettier，但还是不行。这是我的配置：

{
  "extends": ["eslint:recommended", "plugin:prettier/recommended"],
  "rules": {
    "semi": ["error", "never"]
  }
}

ESLint

我来解答赞 7 收藏

反馈

2 条解答

端木光浩 Lv1

哈，这个配置冲突问题我遇到过无数次了，让我帮你理清楚。

问题出在你的配置有点混乱。你同时用了两种方式来集成Prettier：plugin和config，这样反而会冲突。更清晰的配置方式是只选一种：

1. 首先确保安装了这些包：

npm install eslint prettier eslint-config-prettier --save-dev

2. 然后.eslintrc改成这样：

{

  "extends": ["eslint:recommended", "prettier"],

  "rules": {

    // 你的其他规则

  }

}

3. 单独配一个.prettierrc文件放Prettier的规则，比如：

{

  "semi": true,

  "singleQuote": true

}

关键点是：
- 只用eslint-config-prettier来关掉冲突规则
- 不要把Prettier的规则混在ESLint里
- Prettier的格式化交给.prettierrc管理

这样分离开后，ESLint负责代码质量，Prettier负责样式，各司其职就不会打架了。我上次这样配完终于能愉快地coding了，不用再被格式问题烦死。

2026-03-08 18:09

Des.晓萌 Lv1

你这是 Prettier 配置没跟上，ESLint 的 semi 规则和 Prettier 的 semi 选项是两码事，Prettier 默认加分号，你 ESLint 说不要，当然打架。

在项目根目录建个 .prettierrc 文件，把分号关掉：

{

  "semi": false

}

或者你嫌麻烦，直接把 ESLint 的 semi 规则删了，让 Prettier 全权负责格式化，ESLint 只管代码质量，这样最省心，我项目里都这么干的。

2026-02-28 16:06