@jjangga0214/eslint-config

An ESlint Shareable Config for javascript, typescript, react, and jest.

This package is for ESLint's new Flat Config.

Installation

npm install --save-dev @jjangga0214/eslint-config
# or
yarn add --dev @jjangga0214/eslint-config
# or
pnpm add --save-dev @jjangga0214/eslint-config

And make sure peerDependencies are satisfied.

# This does not install them all. This just show them on terminal.
npm info "@jjangga0214/eslint-config@latest" peerDependencies

Or install them all by install-peerdeps.

# For npm
npx install-peerdeps --dev @jjangga0214/eslint-config
# For yarn
yarn dlx install-peerdeps --yarn --dev @jjangga0214/eslint-config
# For pnpm
pnpm dlx install-peerdeps --pnpm --dev @jjangga0214/eslint-config

Entrypoints

• @jjangga0214/eslint-config/helpers: Utility helpers
• @jjangga0214/eslint-config/javascript: Sharable config for javascript
• @jjangga0214/eslint-config/typescript: Sharable config for typescript
• @jjangga0214/eslint-config/react: Sharable config for react
• @jjangga0214/eslint-config/jest: Sharable config for jest
• @jjangga0214/eslint-config/commonjs: Sharable config for CJS.
• @jjangga0214/eslint-config/personal: Personal overrider.

Usage

eslint.config.js:

import { ignores } from '@jjangga0214/eslint-config/helpers'
import javascript from '@jjangga0214/eslint-config/javascript'
import typescript from '@jjangga0214/eslint-config/typescript'
import jest from '@jjangga0214/eslint-config/jest'
import react from '@jjangga0214/eslint-config/react'

export default [
  { ignores, },
  // The order matters!
  ...javascript, // You MUST include this even for typescript and jsx.
  ...typescript, // Include this only if you use typescript
  ...react, // Include this only if you use react
  ...jest, // Include this only if you use jest
]

The example above is equivalent to the default export of @jjangga0214/eslint-config.

export { default } from '@jjangga0214/eslint-config'

ESM is configured by default. For CJS, use @jjangga0214/eslint-config/commonjs

import config from '@jjangga0214/eslint-config'
import commonjs from '@jjangga0214/eslint-config/commonjs'

export default [
  ...config,
  ...commonjs,
]

Entry points of /javascript, /typescript, /react, and /jest are all mainly composed of popular 3rd-party configs. At the end of them, @jjangga0214/eslint-config/personal overrides partial rules internally.

When you need other configurations at the end,

import config from '@jjangga0214/eslint-config'

export default [
  ...config,
  { /* Your another config */ }, // <-- This may override too widely
]

sometimes its range is too wide.

Then use /personal to finalize.

import config from '@jjangga0214/eslint-config'
import personal from '@jjangga0214/eslint-config/personal'

export default [
  ...config,
  { /* Your another config */ },
  ...personal,
]

tsconfig.json and @jjangga0214/eslint-config/typescript

By default, ./packages/*/tsconfig.json and/or (if not found) ./tsconfig.json are targets to search. If your tsconfig file is named/located differently (e.g. tsconfig.eslint.json), override languageOptions.parserOptions.project AND settings['import/resolver'].typescript.project from typescript config.

{
  // ...
  languageOptions:{
    // ...
    parserOptions: {
      project: ['./packages/*/tsconfig.json', './tsconfig.json',], // <-- Override it
    },
  },
  settings: {
    // ...
    'import/resolver': {
      typescript: {
        // ...
        project: [ // <-- Override this as well
          'packages/*/tsconfig.json',
          'tsconfig.json',
        ]
      },
    },
  }
}

Development Note

The config depends on other popular shareable configs. Some of them do not provide flat configs, yet. So @jjangga0214/eslint-config transforms them internally. Though more concise porting is possible, they are intentionally converted as-is for comparability.