@arslivinski/eslint-config

A very opinionated ESLint configuration, mostly focused on web development.

Usage

This configuration requires ESLint >= 8.35.0

To install, run:

npm install -D eslint@^8.35.0 @arslivinski/eslint-config

Then create a .eslintrc.js:

'use strict';

module.exports = {
  extends: ['@arslivinski'],
};

Now you can run:

npm exec eslint -- ./

React

This configuration also provides a set of rules for React projects. To use it, you have to install these extra packages:

npm install -D eslint-plugin-react eslint-plugin-react-hooks

and extend this config on your .eslintrc.js

'use strict';

module.exports = {
  extends: ['@arslivinski/eslint-config', '@arslivinski/eslint-config/module', '@arslivinski/eslint-config/browser'],
  overrides: [
    {
      files: ['*.jsx'],
      extends: ['@arslivinski/eslint-config/react'],
    },
  ],
};

TypeScript

This configuration also provides a set of rules for TypeScript projects. To use you have to install these extra packages:

npm install -D typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-import-resolver-typescript

and extend this config on your .eslintrc.js

'use strict';

module.exports = {
  extends: ['@arslivinski/eslint-config'],
  overrides: [
    {
      files: ['*.ts'],
      parserOptions: {
        tsconfigRootDir: __dirname,
        project: ['./tsconfig.json'],
      },
      settings: {
        'import/resolver': {
          typescript: {
            project: './tsconfig.json',
          },
        },
      },
      extends: ['@arslivinski/eslint-config/module', '@arslivinski/eslint-config/typescript'],
    },
  ],
};

React and TypeScript

It's possible to mix them both. To use this way you have to install these extra packages:

npm install -D eslint-plugin-react eslint-plugin-react-hooks typescript @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint-import-resolver-typescript

and extend this config on your .eslintrc.js

'use strict';

module.exports = {
  extends: ['@arslivinski/eslint-config'],
  overrides: [
    {
      files: ['*.ts', '*.tsx'],
      parserOptions: {
        tsconfigRootDir: __dirname,
        project: ['./tsconfig.json'],
      },
      settings: {
        'import/resolver': {
          typescript: {
            project: './tsconfig.json',
          },
        },
      },
      extends: [
        '@arslivinski/eslint-config/typescript',
        '@arslivinski/eslint-config/module',
        '@arslivinski/eslint-config/browser',
      ],
    },
    {
      files: ['*.tsx'],
      extends: ['@arslivinski/eslint-config/react'],
    },
  ],
};

Node

You can use this configuration for pure Node applications. For this, you need to install the following extra package:

npm install -D eslint-plugin-n

Then, you need to set the Node version on the engine field of your package.json. Example:

{
  "name": "your-module",
  "version": "1.0.0",
  "engines": {
    "node": ">=18.14.0"
  }
}

and finally, extend this config on your .eslintrc.js. If you are using modules:

'use strict';

module.exports = {
  extends: ['@arslivinski/eslint-config', '@arslivinski/eslint-config/module', '@arslivinski/eslint-config/node'],
};

...or if you are using CommonJS:

'use strict';

module.exports = {
  extends: ['@arslivinski/eslint-config', '@arslivinski/eslint-config/commonjs', '@arslivinski/eslint-config/node'],
};

Modules

This package provide the following modules to be used

Name	Import	Description
base	@arslivinski/eslint-config	The base configuration for all kinds of JavaScript and TypeScript
module	@arslivinski/eslint-config/module	To be used when the files make use of ES imports
commonjs	@arslivinski/eslint-config/commonjs	To be used when the files make use of CommonJS
script	@arslivinski/eslint-config/script	To be used when the files are simple browser scripts, usualy imported with the <script> tag that don't make use of ES imports or CommonJS
browser	@arslivinski/eslint-config/browser	To lint files that will be used on a web browser
node	@arslivinski/eslint-config/node	To lint files that will be used on a NodeJS environment
serviceworker	@arslivinski/eslint-config/serviceworker	To be used with ServiceWorkers
worker	@arslivinski/eslint-config/worker	To be used with Workers
webextension	@arslivinski/eslint-config/webextension	To be used with WebExtensions
scripting	@arslivinski/eslint-config/scripting	For script files, like build or release scripts, allowing to usage of console.log and imports from devDependencies
jest	@arslivinski/eslint-config/jest	For Jest test files. Require eslint-plugin-jest