Eslint 9 add a rule to existing configuration

Question

I have a ES9 config that looks like this (eslint.config.js):

import globals from 'globals';
import pluginJs from '@eslint/js';
import tseslint from 'typescript-eslint';
import stylistic from '@stylistic/eslint-plugin';

export default [
  { 
    files: ['src/js/**/*.{js,mjs,cjs,ts}'], 
  },
  stylistic.configs.customize({
    indent: 2,
    quotes: 'single',
    semi: true,
    jsx: true,
    braceStyle: '1tbs'
  }),
  { languageOptions: { globals: globals.browser } },
  pluginJs.configs.recommended,
  ...tseslint.configs.recommended
];

It works, but I also need to add a rule that limits max line length.

The Stylistic has a rule @stylistic/js/max-len, but I'm having trouble adding it.

I tried various ways to add this rule, for example:

export default [
  { 
    files: ['src/js/**/*.{js,mjs,cjs,ts}'], 
  },
  stylistic.configs.customize({
    // the following options are the default values
    indent: 2,
    quotes: 'single',
    semi: true,
    jsx: true,
    braceStyle: '1tbs'
  }),
  { languageOptions: { globals: globals.browser } },
  pluginJs.configs.recommended,
  ...tseslint.configs.recommended,
  {
    rules: {
      "@stylistic/js/max-len": ["error", { "code": 40 }],
    },
  },
]

But it doesnt work, and not only that - it also breaks previous rules when I add:

  {
    rules: {
      "@stylistic/js/max-len": ["error", { "code": 40 }],
    },
  },

Answer 1

what helped to me in similar case is to explicitly specify files in the last rules sections:

export default [
  { 
    files: ['src/js/**/*.{js,mjs,cjs,ts}'], 
  },
  stylistic.configs.customize({
    // the following options are the default values
    indent: 2,
    quotes: 'single',
    semi: true,
    jsx: true,
    braceStyle: '1tbs'
  }),
  { languageOptions: { globals: globals.browser } },
  pluginJs.configs.recommended,
  ...tseslint.configs.recommended,
  {
    files: ['src/js/**/*.{js,mjs,cjs,ts}'],
    rules: {
      "@stylistic/js/max-len": ["error", { "code": 40 }],
    },
  },
]

Answer 2

I've found solution in other place, it seems all I had to do is to remove js/ from rule name since one of imported plugins combines rules:

    rules: {
      '@stylistic/max-len': ['error', { code: 40 }],
    },