eslint flat config

eslint.config.js

// @ts-check

import js from '@eslint/js'
import ts from 'typescript-eslint'
import globals from 'globals'
import parserTs from '@typescript-eslint/parser'
import stylistic from '@stylistic/eslint-plugin'
import stylisticTs from '@stylistic/eslint-plugin-ts'
import stylisticJsx from '@stylistic/eslint-plugin-jsx'
import stylisticJs from '@stylistic/eslint-plugin-js'

export default ts.config(
  {
    languageOptions: {
      globals: {
        ...globals.browser
      }
    }
  },
  js.configs.recommended,
  {
    files: ['src/**/*.ts', 'src/**/*.tsx'],
    languageOptions: {
      parserOptions: {
        project: './tsconfig.app.json',
      }
    },
    extends: ts.configs.recommendedTypeChecked,
    rules: {
      '@typescript-eslint/no-unused-vars': 'warn'
    }
  },
  {
    files: ['**/*.js', 'src/**/*.jsx', 'src/**/*.ts', 'src/**/*.tsx'],
    plugins: {
      '@stylistic': stylistic,
      '@stylistic/js': stylisticJs,
    },
    languageOptions: {
      parser: parserTs,
    },
    rules: {
      '@stylistic/indent': ['error', 2],
      '@stylistic/semi': ['error', 'never'],
    }
  },
  {
    files: ['src/**/*.ts', 'src/**/*.tsx'],
    plugins: {
      '@stylistic/ts': stylisticTs,
    },
    languageOptions: {
      parser: parserTs,
    },
    rules: {
      // '@stylistic/ts/indent': ['error', 2],
      '@stylistic/ts/type-annotation-spacing': 'error',
    }
  },
  {
    files: ['src/**/*.jsx', 'src/**/*.tsx'],
    plugins: {
      '@stylistic/js': stylisticJs,
      '@stylistic/ts': stylisticTs,
      '@stylistic/jsx': stylisticJsx
    },
    languageOptions: {
      parser: parserTs,
    },
    rules: {
      '@stylistic/jsx/jsx-indent': ['error',2, {indentLogicalExpressions: true}],
      '@stylistic/jsx/jsx-closing-tag-location':'error',
      '@stylistic/jsx/jsx-self-closing-comp': 'error',
      "@stylistic/jsx/jsx-sort-props": ['error', {
        "callbacksLast": true,
        "shorthandFirst": true,
        "shorthandLast": false,
        "multiline": "last",
        "ignoreCase": true,
        "noSortAlphabetically": true,
        "reservedFirst": true
      }]

    }
  }
)

package.json

{
  "type": "module",
  "devDependencies": {
    "globals": "15.6.0",
    "@eslint/js": "9.5.0",
    "@stylistic/eslint-plugin": "2.2.2",
    "@stylistic/eslint-plugin-jsx": "2.3.0",
    "@stylistic/eslint-plugin-migrate": "2.3.0",
    "@stylistic/eslint-plugin-ts": "2.3.0",
    "@types/eslint__js": "8.42.3",
    "@types/node": "20.14.8",
    "eslint": "9.5.0",
    "typescript": "5.5.2",
    "typescript-eslint": "7.14.1"
  }
}