@petbee/eslint-config NPM

`@petbee/eslint-config`

This package provides Petbee's ESLint configuration as an extensible shared config, supporting both ESLint v9.x (flat config) and older versions (.eslintrc).

Installation

Give that you already have ESLint installed, run:

yarn add -D @petbee/eslint-config typescript prettier

Usage

For ESLint v8.x and older (legacy config)

// .eslintrc
{
  "extends": ["@petbee/eslint-config"]
}

For ESLint v9.x (flat config)

// eslint.config.js
import petbeeConfig from '@petbee/eslint-config'

export default [
  ...petbeeConfig,
  // Your custom configurations...
]

For projects using both ESLint versions

If you need to support both ESLint versions in the same project, you can:

// eslint.config.js
import petbeeConfig from '@petbee/eslint-config'

export default [
  ...petbeeConfig,
  // Your custom configurations...
]

And maintain a .eslintrc file:

// .eslintrc
{
  "extends": ["@petbee/eslint-config"]
}

As any other eslint preset, it's possible to override some rules and configurations. We encourage trying to keep the closest possible to the preset rules, but every project is different and sometimes overriding is needed, use it carefully.

For typescript

The preset will automatically load Typescript rules when dealing with .ts or .tsx files. However, there are some rules that require type-checking. This means that a tsconfig.json, which includes all files supposed to be linted, must be present. If your existing configuration does not include all of the files you would like to lint, you can create a separate tsconfig.eslint.json, at the root of your project, as follows:

// tsconfig.eslint.json
{
  "extends": "./tsconfig.json",
  "include": ["**/*.ts", "**/*.tsx", "**/*.js"],
  "exclude": []
}

And you should be good to go.

For NestJS

The preset will automatically load NestJS rules when your projects has @nestjs/core installed. However, if you are using NestJS with Typescript, you need to make sure that the tsconfig.json file is present at the root of your project. If you are using a custom tsconfig.json, you can create a separate tsconfig.eslint.json file as follows:

// tsconfig.eslint.json
{
  "extends": "./tsconfig.json",
  "include": ["**/*.ts", "**/*.tsx", "**/*.js"],
  "exclude": []
}

This will ensure that the ESLint parser can find all the files that need to be linted.

For Javascript

Sometimes you want to use modern, not yet officially supported, syntax in your Javascript files, such as dynamic import(). This can be achieved by using the babel-eslint parser. For size reasons, we don't include it in this preset but it's extremely simple to configure it:

yarn add -D babel-eslint

// .eslintrc
{
  "extends": "@petbee/eslint-config",
  "parser": "babel-eslint",
  "parserOptions": {
    "sourceType": "module"
  }
}

If a project uses both Typescript and Javascript, you can configure the parser inside an override block:

// .eslintrc
{
  "extends": "@petbee/eslint-config",
  "overrides": [
    {
      "files": ["*.js", "*.jsx"],
      "parser": "babel-eslint",
      "parserOptions": {
        "sourceType": "module"
      }
    }
  ]
}

Please check the babel-eslint documentation for further options.