Full example for flat config with object

Tell us about your environment

ESLint version: 9
eslint-plugin-vue version: 9
Vue version: 2
Node version: 20

The problem you want to solve. I converted my eslint config to flat config. I used a lot of overrides, and tried to recreated that with specific objects that contain plugins etc.

So for eample previously my vue config looked like this:

overrides: [
    {
      files: ['packages/client/src/components/**/*.vue', 'stories/**/*.vue'],
      extends: ['plugin:vue/strongly-recommended'],
      parser: 'vue-eslint-parser',
      parserOptions: {
        parser: '@typescript-eslint/parser',
      },
      rules: {
        'max-lines': ['error', { max: 900 }],
      }
    }
]

The only way I managed to recreate this is by exactly spreading the arrays in the flat vue config. This involved looking at the plugin to see how many arrays it includes. Is there no easier way? I don't even know if I have included everything.

  {
    files: ['packages/client/src/components/**/*.vue', 'stories/**/*.vue'],
    languageOptions: {
      ...vue.configs['flat/vue2-strongly-recommended'][1].languageOptions,
      parserOptions: {
        parser: '@typescript-eslint/parser',
      },
    },
    plugins: {
      vue,
    },
    rules: {
      ...vue.configs['flat/vue2-strongly-recommended'][2].rules,
      ...vue.configs['flat/vue2-strongly-recommended'][3].rules,
      'max-lines': ['error', { max: 900 }],
    },
  },

Your take on the correct solution to problem.

I don't have a good idea, but it would definitely help if the rules and the language options were accessible in a merged object.

vuejs / eslint-plugin-vue

Full example for flat config with object #2448