Terrax ESLint Config

This config was inspired by eslint-config-neon and eslint-config-tesseract.

Installation

# NPM
npm install -D eslint eslint-config-terrax

# Yarn
yarn add -D eslint eslint-config-terrax

# PNPM
pnpm add -D eslint eslint-config-terrax

Configurations

Package includes the following configurations:

| Configuration | Description | | -------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | | eslint-config-terrax/common | The terrax code style guide. | | eslint-config-terrax/browser | For usage with DOM and other browser APIs. | | eslint-config-terrax/edge | For usage with an edge runtime Vercel, Cloudflare Workers, or others. | | eslint-config-terrax/jsx | For usage with JSX (with or without React). | | eslint-config-terrax/jsx-a11y | For usage with JSX (with or without React) and want to include accessibility checks. | | eslint-config-terrax/next | For usage with Next.js. | | eslint-config-terrax/node | For usage with Node.js. | | eslint-config-terrax/prettier | For usage with Prettier. | | eslint-config-terrax/react | For usage with React. | | eslint-config-terrax/typescript | For usage with TypeScript. |

Notes

Flat Config only

It is important to note that this package only exports ESLint Flat Config! This means that you have to use at least ESLint 9 and eslint.config.js, eslint.config.mjs, or eslint.config.cjs to use this package. See the ESLint documentation on flat config for more information.

Importing

There are two ways to import the configs:

import common from 'eslint-config-terrax/common';

or

import { common } from 'eslint-config-terrax';

Merging Configs

In the examples below you will see lodash.merge being used. This is of vital importance as objects often have to be deeply merged when using ESLint Flat Config. If you don't merge the objects, you will overwrite the previous object with the new one, and your config will be invalid.

Usage

NodeJS

import { common, node, typescript } from 'eslint-config-terrax';
import merge from 'lodash.merge';

/**
 * @type {import('@typescript-eslint/utils').TSESLint.FlatConfig.ConfigArray}
 */
const config = [
    ...[...common, ...node, ...typescript].map((config) =>
        merge(config, {
            files: ['src/**/*.ts'],
            languageOptions: {
                parserOptions: {
                    project: 'tsconfig.eslint.json'
                }
            }
        })
    )
];

export default config;

NextJS

import { browser, common, edge, next, node, react, typescript } from 'eslint-config-terrax';
import merge from 'lodash.merge';

/**
 * @type {import('@typescript-eslint/utils').TSESLint.FlatConfig.ConfigArray}
 */
const config = [
    ...[...common, ...browser, ...node, ...typescript, ...react, ...next, ...edge].map((config) =>
        merge(config, {
            files: ['src/**/*.ts'],
            settings: {
                react: {
                    version: 'detect'
                }
            },
            languageOptions: {
                parserOptions: {
                    project: 'tsconfig.json'
                }
            }
        })
    )
];

export default config;

Usage with Prettier

Just add it as the last config in your extends configuration, e.g.

import { common, typescript, prettier } from 'eslint-config-terrax';

export default [...common, ...typescript, ...prettier];