ESLint - Situational rules

These rules are situational depending on the tools you are using.

storybook + react-testing-library

When using storybook and/or react-testing-library, it can be useful to disable certain rules with overrides for these files, which, while useful in production code, can cause false positive issues in your stories and tests.

When using the ESLint vitest plugin with ESLint 8.57.0, you must extend legacy-recommended.

const storybookConfig = [...storybook.configs['flat/recommended']];
 
const testHarnessConfig = [
  {
    files: ['*.test.ts?(x)', '*.stories.ts?(x)', 'test/**/*.ts?(x)'],
    name: 'vitest',
    plugins: {
      'jest-dom': jestDom,
      vitest,
    },
    rules: {
      ...vitest.configs.recommended.rules,
    },
  },
];

Next article: ESLint - Controversial rules

Previous article: ESLint - Sorting

Main article: How to take your workflow to the next level with ESLint on-save fixes