Skip to main content


Rules and config

Airbnb rules:

Turn off all rules that are unnecessary or might conflict with Prettier:

Disable a rule

You can disable a rule on a specific line, a whole file, a block of code or globally. See:

On a specific line:

// eslint-disable-next-line @typescript-eslint/no-explicit-any
export function isNumber(n: any): boolean {}

In an entire file, put a comment at the top:

/* eslint-disable @typescript-eslint/no-empty-function */


module.exports = {
rules: {
'@typescript-eslint/no-explicit-any': 'off',

Options are (source):

  • "off" or 0: turn the rule off
  • "warn" or 1: turn the rule on as a warning (doesn’t affect exit code)
  • "error" or 2: turn the rule on as an error (exit code is 1 when triggered)

Ignoring files and folders

See all options here:

Disable eslint for all files in directory and subdirectories -

You can have a .eslintignore file like .gitignore:


You can also set ignorePatterns in .eslintrc.js:

module.exports = {
ignorePatterns: ['build/'],

In package.json use eslintIgnore:

"eslintIgnore": ["file.js"]

Note that node_modules and dot-files and dot-folders are ignored. See for more details and exceptions.


# local install in node_modules
npx eslint src/**/*.js
npx eslint './**/*.{js,jsx,ts,tsx}'
npx eslint 'src/**/*.{js,jsx,ts,tsx}'
npx eslint . --ext ts --ext tsx --ext js

# global install
eslint --cache --fix

On a npm package.json script we don't need the npx prefix:

"scripts": {
"eslint": "eslint 'src/**/*.{js,jsx,ts,tsx}'"

You can verify that a npm script correctly runs the local ESLint (instead of a global install) by adding a script that runs which eslint. Running this script will print /project-path/node_modules/.bin/eslint.


Docs - Getting Started with ESLint:

See for all info about @eslint/config.

npm init @eslint/config

(Note: in the past you used eslint --init.)

Optionally, you can specify a shareable config with --config:

npm init @eslint/config --config semistandard # npm <= 6
npm init @eslint/config -- --config semistandard # npm >= 7

You can pass an array of configs too - see docs. A shareable config is set on the .eslintrc.js extends field. Some configurations are:

Search npm for more shareable configs:

For a Node.js project with Prettier answer this to the following questions:

  • How would you like to use ESLint? -> To check syntax and find problems
  • Which framework does your project use? React, Vue, None of these. -> None of these
  • Where does your code run? -> Node. Warning: you need to unselect 'Browser' with space!

Finally, it will say something like "The config that you've selected requires the following dependencies: @typescript-eslint/eslint-plugin@latest, @typescript-eslint/parser@latest, eslint@latest. Would you like to install them now?". If you answer 'Yes' it creates the file .eslintrc.js and updates package.json (adding the dependencies to devDependencies).


You can use npm init @eslint/config to create .eslintrc.js. It asks questions. See setup below.

.eslintrc.js for Node.js

You must have node: true otherwise you get the error "'process' is not defined" - see this and this.

module.exports = {
env: {
es2021: true,
node: true,

.eslintrc.js for React Native

For instructions on how to setup ESLint with React Native see (If using npm instead of yarn do npm install --save-dev eslint @react-native-community/eslint-config.)

Note that it does not work with ESLint 8, we need to use version 7 (see So in package.json we should have something like "eslint": "^7.32.0". But first check the ESLint version that @react-native-community/eslint-config currently uses here:

In summary, we need to do to something like: yarn add --dev eslint prettier @react-native-community/eslint-config@7.32.0.

Then add the following .eslintrc.js:

module.exports = {
root: true,
// In WebStorm, 'extends' 'prettier' removes the yellow bars, whereas the 'rules' sections gets rid of the red
// squiggles that prettier is going to fix automatically for us (hence there's no point in seeing them).
extends: ['@react-native-community', 'prettier'],
rules: {
'prettier/prettier': 'off',
quotes: 'off',
'no-trailing-spaces': 'off',
semi: 'off',
// babel-preset-expo automatically converts JSX to JS without the need to
// import React - see
// Rules taken from
'react/jsx-uses-react': 'off', // Prevent React to be marked as unused
'react/react-in-jsx-scope': 'off', // 'React' must be in scope when using JSX
globals: {
// Suppress error "'JSX' is not defined" when using JSX.Element as type.
// From
JSX: true,

New config

Docs -

.eslintrc* is replaced with eslint.config.js.


To get the red squiggles and warnings we need to enable it!

At Preferences -> Languages & Frameworks -> JavaScript -> Code Quality Tools -> ESLint, set 'Automatic ESLint configuration'.