ESLint Flat Config for Svelte5 w/ Typescript

eslint.config.js

// Typescript is not entirely working yet...
// pnpm i -D globals
import globals from 'globals';

import jsESLint from '@eslint/js';
// import * as espree from "espree";
import tsESLint from 'typescript-eslint';
import tsESLintParser from '@typescript-eslint/parser';
// TODO: I wasn't able to get the parser for extra files working, but maybe we don't need it?
// import * as tsESLintExtraParser from 'typescript-eslint-parser-for-extra-files';
// TODO: Turn on JSDoc, but not yet. Warning volume is already overwhelming.
// import jsdoc from 'eslint-plugin-jsdoc';
import markdown from 'eslint-plugin-markdown';
import eslintPluginSvelte from 'eslint-plugin-svelte';
import svelteESLintParser from 'svelte-eslint-parser';

const ignores = [
	// "./eslint.config.js"
	'.DS_Store',
	'node_modules/**/*',
	'build/**/*',
	'.svelte-kit/**/*',
	'package/**/*',
	'.env',
	'.env.*',
	// Ignore files for PNPM, NPM and YARN
	'pnpm-lock.yaml',
	'package-lock.json',
	'yarn.lock',
	// On CI our PNPM store is local to the application source
	'.pnpm-store/**/*',
	'src/paraglide/**/*'
];
export default tsESLint.config(
	jsESLint.configs.recommended, // Recommended config applied to all files
	...tsESLint.configs.recommended,

	// jsdoc.configs['flat/recommended'],
	...markdown.configs.recommended,
	// flat/prettier: Turns off rules that may conflict with Prettier.
	// Prettier is run separately, not through ESLint.
	...eslintPluginSvelte.configs['flat/prettier'],

	{
		ignores
		// plugins: {
		// 	tsESLint,
		// },
	},
	{
		languageOptions: {
			ecmaVersion: 'latest',
			globals: {
				$bindable: 'readonly',
				...globals.browser,
				...globals.node,
				...globals.es6
			}
		}
	},
	// {
	// 	files: ['**/*.js'],
	// ...ignores,
	// 	plugins: {
	// 		jsdoc,
	// 	},
	// 	rules: {
	// 		'jsdoc/require-description': 'warn'
	// 	}
	// },

	// Configure typescript-eslint-parser for typescript
	{
		files: ['*.ts', '*.tsx'],
		ignores,
		languageOptions: {
			sourceType: 'module',
			parser: tsESLintParser,
			// parser: tsESLintExtraParser,
			parserOptions: {
				project: './tsconfig.json'
			}
		}
	},

	// Configure svelte-eslint-parser with typescript-eslint-parser
	// 	for the non-svelte parts
	{
		files: ['*.svelte'],
		ignores,
		languageOptions: {
			parser: svelteESLintParser,
			parserOptions: {
				// Parse the `<script>` in `.svelte` as TypeScript by adding the following configuration.
				parser: tsESLintParser,
				extraFileExtensions: ['.svelte'], // This is a required setting in `@typescript-eslint/parser` v4.24.0.
				// parser: {
				// 	ts: tsESLintExtraParser,
				// 	js: espree,
				// },
				project: './tsconfig.json'
			}
		}
	}
);