A reusable eslint config that I use for most of my projects.
MIT License
A reusable eslint config that I use for most of my projects.
Starting at 5.0.0
, I only support eslint@^9
or greater.
npm install -D eslint @mlaursen/eslint-config
Then create an eslint.config.mjs
with the following:
// @ts-check
import { config, configs, gitignore } from "@mlaursen/eslint-config";
// choose the config you want to use:
// somewhat strict type checking
export default config(gitignore(import.meta.url), ...configs.frontend);
// strict type checking
export default config(gitignore(import.meta.url), ...configs.frontendTypeChecking(import.meta.dirname));
The config
export is the typescript-eslint.config()
function to provide type
definitions and gitignore
automatically ignores files from linting based on
your .gitignore
rules.
I normally just use the frontend
or frontendTypeChecking
configs, but the
others can be used individually if needed.
The base config is automatically used by the typescript config and is just the eslint.configs.recommended
and a few other stylistic changes.
This should not be used if the typescript or typescriptTypeChecking configs are used.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.base);
This extends the base config and the tseslint.configs.strict
config. It also includes a few stylistic choices for type
behavior and disabled strict rules in test files.
Only this rule or typescripttypechecking should be used. They should not be used together.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.typescript);
This is the same as the typescript config but also includes the tseslint.configs.strictTypeCheckedOnly
config.
Only this rule or typescript should be used. They should not be used together.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.typescriptTypeChecking(import.meta.dirname));
This only enables the eslint-plugin-jest.configs['flat/recommended]
rules on tests files.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.jest);
This only enables the eslint-plugin-jest-dom.configs['flat/recommended]
rules on tests files.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.jestDom);
This enables the eslint-plugin-testing-library/.configs["flat/react]
plugin and rules on test files.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.testingLibraryReact);
This enables the eslint-plugin-testing-library/.configs["flat/dom]
plugin and rules on test files.
This should not be used with the testingLibraryReact rules
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.testingLibraryDom);
This enables the eslint-plugin-react
and eslint-plugin-react-hooks
:
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.react);
This enables eslint-plugin-jsx-a11y
:
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.jsxA11y);
This is a small wrapper around the @next/eslint-plugin-next
that works with eslint v9.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.next);
This is my normal frontend repo setup with react
, jsxA11y
, jest
,
jest-dom
, typescript
, testing-library/react
.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.frontend);
Same as the frontend, but enables the strict type checking.
// @ts-check
import { config, configs } from "@mlaursen/eslint-config";
export default config(...configs.frontendTypeChecking(import.meta.dirname));