ESLint配置中extends顺序会影响规则优先级吗？

Des.子武提问于 2026-01-25 22:24:24 阅读 26

前端

在项目里同时用了airbnb和vue的ESLint配置，调整extends顺序后报错还是没解决，这是怎么回事？

我设置了这样的配置文件：


module.exports = {
  extends: [
    'airbnb',
    'plugin:vue/essential'
  ],
  rules: {
    'quotes': ['error', 'backtick']
  }
};

虽然设置了quotes规则，但保存Vue文件时还是提示”必须使用双引号”。查文档说extends顺序后面的优先级高，但把vue放到airbnb前面后，其他vue相关规则又开始报错，这是不是优先级逻辑有问题？

ESLint配置

我来解答赞 7 收藏

反馈

2 条解答

Good“东宇 Lv1

问题是 extends 的顺序确实会影响规则优先级，但你的配置里 airbnb 和 vue 的规则可能有冲突。试试把 plugin:vue/essential 放在前面，并明确覆盖 quotes 规则：

module.exports = {

  extends: [

    'plugin:vue/essential',

    'airbnb'

  ],

  rules: {

    'quotes': ['error', 'backtick'],

    'vue/valid-v-model': 'off' // 如果有其他冲突规则也手动调整

  }

};

如果还有问题，直接禁用冲突的规则或单独调整。折腾 ESLint 真的挺让人头大，但这样应该能解决。

2026-02-02 18:08

炜曦的笔记 Lv1

问题出在规则冲突上，plugin:vue/essential 本身也会定义 quotes 规则，默认是双引号。省事的话直接覆盖掉所有相关规则就行了：

module.exports = {

  extends: [

    'airbnb',

    'plugin:vue/essential'

  ],

  rules: {

    'quotes': ['error', 'backtick'],

    'vue/quotes': ['error', 'backtick'] // 显式覆盖 vue 的 quotes 规则

  }

};

这样就明确了优先级，不会再报错了。

2026-01-29 10:09