@riveo/eslint-config

Opinionated flat ESLint config for TypeScript-first projects, with support for plain JavaScript, Astro, React, and Next.js.

This package is extracted from the setup described in the blog post notesofdev: My optimal ESLint setup, but the package itself is the source of truth.

Why This Config

This package is aimed at projects that want:

• flat config
• TypeScript-first defaults
• typed linting for TS files
• import hygiene through eslint-plugin-import-x
• Prettier compatibility without using ESLint as a formatter
• a small amount of opinionated behavior on top of upstream recommended configs

What It Includes

• ESLint core recommended rules
• typescript-eslint recommended and stylistic rules
• typed TypeScript rules for *.ts, *.tsx, *.cts, and *.mts
• eslint-plugin-import-x rules
• eslint-config-prettier
• a small set of additional preferences:
  • no-console allows warn, error, and info
  • class-methods-use-this is disabled
• Astro support through configs.astro
• Next.js support through configs.nextjs
• React support through configs.react

Installation

Install the package and ESLint:

pnpm add -D @riveo/eslint-config eslint@^9

For TypeScript projects, also make sure typescript is installed in your app:

pnpm add -D typescript

Usage

Create eslint.config.mjs:

import { defineConfig } from 'eslint/config';
import { configs } from '@riveo/eslint-config';

export default defineConfig(
  {
    files: ['**/*.ts', '**/*.tsx'],
    languageOptions: {
      parserOptions: {
        projectService: true,
        tsconfigRootDir: import.meta.dirname,
      },
    },
  },
  configs.recommended,
);

JavaScript-Only

For JavaScript-only projects, you can still use the main config:

import { defineConfig } from 'eslint/config';
import { configs } from '@riveo/eslint-config';

export default defineConfig(configs.recommended);

Astro

For Astro, include configs.astro as well:

import { defineConfig, globalIgnores } from 'eslint/config';
import { configs } from '@riveo/eslint-config';

export default defineConfig(
  globalIgnores(['.astro']),
  {
    files: ['**/*.ts', '**/*.tsx'],
    languageOptions: {
      parserOptions: {
        projectService: true,
        tsconfigRootDir: import.meta.dirname,
      },
    },
  },
  configs.recommended,
  configs.astro,
);

Exports

The package exports two values:

• configs
• ruleOptions

configs.recommended

The main config for JavaScript and TypeScript projects. It combines:

• JavaScript base rules
• import rules
• TypeScript rules
• typed TypeScript rules
• Prettier compatibility
• useful custom rule overrides

configs.astro

Additional Astro-specific config. Use it together with configs.recommended.

configs.nextjs

Additional Next.js-specific config. Use it together with configs.recommended. It already includes configs.react.

configs.react

Additional React-specific config. Use it together with configs.recommended.

ruleOptions

Helper values exposed for custom overrides. This is useful when extending rules with predefined options.

Notes

• Typed linting is enabled only for TypeScript files.
• import-x/no-unresolved is disabled for TypeScript files to avoid false positives and resolver overhead.
• Raw JavaScript files are forced through espree instead of the TypeScript parser.
• The package is built before publishing and exports compiled files from dist/.

Development

Useful scripts in this repository:

pnpm run build
pnpm run check
pnpm run check:types
pnpm run check:lint
pnpm run check:format
pnpm test

More contributor notes are in CONTRIBUTING.md.

License

MIT. See LICENSE.md.