Update ESLint to version 9

ESLint 9 is the default linter in Content SDK 1.1 and later. If you're upgrading from an earlier Content SDK version, you can optionally update ESLint to version 9 for its benefits. If you don't update, you can still use the older version of the linter.

ESLint 9 provides the following benefits:

Uses flat config by default - a single, explicit config file that imports plugins directly, making configs clearer and easier to compose than legacy .eslintrc* files.
Clarity and maintainability - as there's no implicit plugin loading, you import exactly what you use. This improves clarity, the ability to debug, and aligns with modern ESM patterns.
Aligns with our ecosystem - TypeScript‑ESLint v8 and the Next.js ESLint plugin both support ESLint 9 and flat config.

To update ESLint to version 9:

In your existing Content SDK app's root directory, remove the .eslintrc file.

Create the eslint.config.mjs file with the following contents:

RequestResponse

import { defineConfig } from 'eslint/config';
import js from '@eslint/js';
import pluginNext from '@next/eslint-plugin-next';
import tsParser from '@typescript-eslint/parser';
import tsPlugin from '@typescript-eslint/eslint-plugin';
import importPlugin from 'eslint-plugin-import';
import reactHooks from 'eslint-plugin-react-hooks';
import globals from 'globals';

export default defineConfig([
  {
    plugins: {
      '@next/next': pluginNext,
      '@typescript-eslint': tsPlugin,
      import: importPlugin,
      'react-hooks': reactHooks,
    },
  },
  {
    files: ['**/*.{js,jsx,ts,tsx}'],
    languageOptions: {
      parser: tsParser,
      parserOptions: {
        ecmaVersion: 2021,
        sourceType: 'module',
        ecmaFeatures: { jsx: true },
      },
      globals: {
        // bring in Node + Browser + modern JS globals
        ...globals.node,
        ...globals.browser,
        ...globals.es2021,
        // ensure URL is defined
        URL: 'readonly',
      },
    },
    rules: {
      // ESLint’s own recommended JS rules
      ...js.configs.recommended.rules,
      // Next.js “recommended” + “core-web-vitals”
      ...pluginNext.configs.recommended.rules,
      ...pluginNext.configs['core-web-vitals'].rules,
      // TypeScript-specific unused‐vars rule
      '@typescript-eslint/no-unused-vars': ['error', { argsIgnorePattern: '^_' }],
      'no-unused-vars': 'off',
      'no-undef': 'off',
      // import+react-hooks rules now that the plugins are loaded
      'import/no-anonymous-default-export': 'error',
      'react-hooks/exhaustive-deps': 'warn',
      'react-hooks/rules-of-hooks': 'error',
      // custom prefs
      'prefer-const': 'error',
      'no-var': 'error',
    },
  },
]);

Important

The flat config covers most use cases and you don't need to add disable rules to specific components. You can still add disable rules for very specific use cases based on your requirements.

If you are using a non-autogenerated component-map, open the component-map.ts file and add the following at the start:
RequestResponse
```
/* eslint-disable no-unused-expressions, @typescript-eslint/no-unused-expressions */
```

In your application's package.json file:

Remove the following dependencies:

RequestResponse

"@typescript-eslint/eslint-plugin": "^8.32.0",
"@typescript-eslint/parser": "^8.32.0",
...
"eslint": "^8.56.0",
"eslint-config-next": "^13.1.5",
"eslint-config-prettier": "^8.6.0",
"eslint-plugin-prettier": "^5.4.0",
"eslint-plugin-react": "^7.37.5",
...
"prettier": "^3.5.3",

Replace them with the following:

RequestResponse

"@stylistic/eslint-plugin": "^5.2.2",
"@typescript-eslint/eslint-plugin": "8.39.0",
"@typescript-eslint/parser": "8.39.0",
...
"eslint": "^9.32.0",
"eslint-config-next": "15.4.6",
"eslint-config-prettier": "^10.1.8",
"eslint-plugin-import": "2.32.0",
"eslint-plugin-jsdoc": "52.0.3",
"eslint-plugin-prettier": "^5.5.3",
"eslint-plugin-react": "7.37.5",
"eslint-plugin-react-hooks": "5.2.0",
...
"prettier": "^3.6.2",

Run the following command to auto fix the remaining lint problems:
RequestResponse
```
npm run lint -- --fix
```

This updates ESLint to version 9. If you have custom linting rules, follow the migration guide to convert them to the new format.

Do you have some feedback for us?

If you have suggestions for improving this article,