Imperium ESLint Config

This is a strict configuration for ESLint. It is meant for those who have never found a linter annoying before.

Currently supports ESLint v10 with the flat config only.

Quickstart

1. Install dependencies: npm i --save-dev eslint eslint-config-imperium
2. Create eslint.config.js (see Example Configuration)
3. Run your linter: npm run lint (or npx eslint)

Example Configuration

// eslint.config.js
import { auto } from "eslint-config-imperium";

export default auto;

auto is the strict core preset of this package. It currently includes base, typescript, stylistic, and perfectionist. It does not detect frameworks or environments automatically.

Configurations

This package is modular and includes several configurations intended to be enabled for certain environments. If you don't know what you need, you should probably use auto. Otherwise, pick a combination of the above configurations.

Main

• auto - Special configuration in which some of the below configurations are enabled
• base - Base framework and environment agnostic configuration

Frameworks / Environments

• astro - Astro configuration
• browser - Browser environment configuration
• next - Next.js configuration
• node - Node environment configuration
• react - React configuration
• solid - Solid configuration
• svelte - Svelte configuration
• tailwind - Tailwind CSS v4 configuration
• tanstackQuery - TanStack Query configuration
• testingLibrary - Testing Library configuration
• typescript - TypeScript configuration
• vitest - Vitest configuration
• vue - Vue configuration

Framework modules are intentionally kept separate from runtime modules. Use browser or node when you want runtime globals and environment-specific rules, and then layer framework or library modules on top.

Style

• perfectionist - Perfectionist configuration for objects order
• prettier - Prettier configuration
• stylistic - Stylistic configuration

You should not enable prettier and stylistic at the same time.

Accessibility

• jsxA11y - JSX accessibility rules

Recommended Composition

The package is designed to be composed explicitly. A few common combinations:

Browser TypeScript App

import { auto, browser } from "eslint-config-imperium";

export default [
  ...auto,
  browser,
];

React App

import { auto, browser, jsxA11y, react } from "eslint-config-imperium";

export default [
  ...auto,
  browser,
  react,
  jsxA11y,
];

Next.js App

import { auto, browser, jsxA11y, next, react } from "eslint-config-imperium";

export default [
  ...auto,
  browser,
  react,
  next,
  jsxA11y,
];

Node.js Library

import { auto, node } from "eslint-config-imperium";

export default [
  ...auto,
  node,
];

Vitest + Testing Library

import { auto, browser, react, testingLibrary, vitest } from "eslint-config-imperium";

export default [
  ...auto,
  browser,
  react,
  vitest,
  testingLibrary,
];

Svelte App

svelte is exported as an array of configs (it sets up the Svelte parser and processor), so spread it like auto:

import { auto, browser, svelte } from "eslint-config-imperium";

export default [
  ...auto,
  browser,
  ...svelte,
];

Astro App

astro is also exported as an array of configs (it sets up the Astro parser, processor, and <script> handling), so spread it like auto:

import { astro, auto } from "eslint-config-imperium";

export default [
  ...auto,
  ...astro,
];

Tailwind App

tailwind targets .jsx/.tsx files and requires Tailwind CSS v4 (v3 is no longer supported). The plugin resolves your Tailwind theme from a CSS entry at lint time, so set settings.tailwindcss.cssConfigPath to your Tailwind CSS file (it defaults to src/style.css). Without a resolvable entry, the class-aware rules will error.

import { auto, browser, react, tailwind } from "eslint-config-imperium";

export default [
  ...auto,
  browser,
  react,
  tailwind,
  {
    settings: {
      tailwindcss: {
        cssConfigPath: "src/styles/globals.css",
      },
    },
  },
];

Typed Linting

The typescript and auto configurations use parserOptions.projectService to enable type-aware linting. This automatically finds the closest tsconfig.json for each file.

If your editor or environment runs ESLint from a directory other than the project root, you may need to set tsconfigRootDir explicitly:

// eslint.config.js
import { auto } from "eslint-config-imperium";

export default [
  ...auto,
  {
    languageOptions: {
      parserOptions: {
        tsconfigRootDir: import.meta.dirname,
      },
    },
  },
];

Plugins

This is a list of the currently used ESLint plugins:

• @e18e/eslint-plugin
• @eslint-community/eslint-plugin-eslint-comments
• @eslint-react/eslint-plugin
• @eslint/compat
• @next/eslint-plugin-next
• @stylistic/eslint-plugin
• @tanstack/eslint-plugin-query
• @typescript-eslint/eslint-plugin
• @vitest/eslint-plugin
• eslint-plugin-astro
• eslint-plugin-import-x
• eslint-plugin-jsdoc
• eslint-plugin-jsx-a11y
• eslint-plugin-n
• eslint-plugin-no-barrel-files
• eslint-plugin-perfectionist
• eslint-plugin-prettier
• eslint-plugin-promise
• eslint-plugin-react-hooks
• eslint-plugin-react-refresh
• eslint-plugin-regexp
• eslint-plugin-security
• eslint-plugin-solid
• eslint-plugin-sonarjs
• eslint-plugin-svelte
• eslint-plugin-tailwindcss
• eslint-plugin-testing-library
• eslint-plugin-unicorn
• eslint-plugin-unused-imports
• eslint-plugin-vue

Building

1. Clone the repository: git clone https://github.com/Delemangi/eslint-config-imperium.git
2. Install the dependencies: npm i
3. Build the package: npm run build

After this, the build output will be placed in the lib folder. You may use it directly, pack it or whatever you'd like afterwards.

License

This project is licensed under the terms of the MIT license.