Javascript – Eslint 9 add a rule to existing configuration

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 }],
    },
  },