元素
元素
工具
博客
问答

Prettier 和 ESLint 冲突了怎么办？

司马雨帆 阅读 53
工具

我刚在项目里同时配了 Prettier 和 ESLint，结果保存代码时格式老是打架。比如 ESLint 要求分号结尾，Prettier 却自动删掉，改完一保存又变回去了，烦死了。

我试过装 eslint-config-prettier 和 eslint-plugin-prettier，也按网上教程改了配置，但还是不行。这是我的 .eslintrc.cjs：

module.exports = {
  extends: ['eslint:recommended', 'plugin:prettier/recommended'],
  rules: {
    'prettier/prettier': 'error',
    'semi': ['error', 'always']
  }
};
我来解答 赞 8 收藏
二维码
手机扫码查看
反馈
2 条解答
广利酱~
广利酱~ Lv1
遇到 Prettier 和 ESLint 冲突的情况，确实挺头疼的。你已经尝试了一些解决方法，但还是有问题。其实这种情况通常是因为配置上有点儿小问题。

首先，确保你的 ESLint 配置文件里正确地覆盖了 Prettier 的规则。你已经在 extends 里加了 eslint:recommended 和 plugin:prettier/recommended，这很好。但是你在 rules 里又手动加了 semi: ['error', 'always']，这就跟 Prettier 的默认规则冲突了。Prettier 默认是不强制要求分号的。

你可以试试去掉 semi 这一行，让 Prettier 来统一处理代码风格。修改后的配置可以这样：

module.exports = {

  extends: ['eslint:recommended', 'plugin:prettier/recommended'],

  rules: {

    'prettier/prettier': 'error',

  }

};


这样 ESLint 就不会跟 Prettier 冲突了，Prettier 会负责格式化代码，而 ESLint 只做代码质量检查。

另外，确保你的编辑器或者 IDE 配置里正确集成了这两个工具，并且在保存时自动格式化代码。这样每次保存文件，Prettier 会先格式化代码，然后 ESLint 检查代码质量。

希望这样能解决你的问题。如果还有其他冲突，可能得仔细检查一下具体的规则配置了。有时候工具版本的不同也会导致奇怪的问题，注意保持工具版本的一致性。
点赞
2026-03-24 21:10
爱学习的诗诗
爱学习的诗诗 Lv1
你这配置问题出在 ESLint 的 semi 规则和 Prettier 的冲突了，plugin:prettier/recommended 本身已经集成了 eslint-config-prettier，会自动关闭所有和 Prettier 冲突的 ESLint 格式规则，但你又手动加了 'semi': ['error', 'always']，等于跟 Prettier 打架。

直接用这个配置改掉：

module.exports = {

  extends: ['eslint:recommended', 'plugin:prettier/recommended'],

  rules: {

    // 别再写 semi 这种规则了，Prettier 说了算

  }

};


然后确保你用的 Prettier 版本是 2.x（现在基本都 2.x 了），再检查下有没有 .prettierrc 或 prettier 字段在 package.json 里，比如：

{

  "semi": false,

  "singleQuote": true,

  "trailingComma": "all"

}


如果项目里用了 .editorconfig，也顺手删掉缩进相关的配置，别让三个人抢着管格式。

最后一步，重启 VS Code（或者你用的编辑器），别光保存，有些插件缓存没清干净会继续乱来。

搞定后，你改代码保存一次，再看是不是不再反复横跳了。
点赞 4
2026-02-25 04:02
相关推荐
元素
元素
工具
博客
问答
登录/注册