Linting

Contents

ESLint is a static code analysis tool for identifying problematic patterns found in JavaScript code.

ESlint is highly configurable and can be used to enforce a consistent coding style. Having linting as a part of the build process is considered a good practice.

Install

npm install --save-dev eslint @eslint/js typescript-eslint

Configure

package.json

Add the following scripts to the package.json file:

{
  "scripts": {
    "check": "concurrently -c auto -g --timings npm:check:types npm:lint",
    "lint": "eslint --cache",
  }
}
Note that check command was added to package.json in the previous chapter about type checking. Here we just modify it to execute linting as a part of the check command.

eslint.config.mjs

Create the following file:

eslint.config.mjs
import eslint from '@eslint/js';
import tseslint from 'typescript-eslint';

export default tseslint.config(

  // If ignores is used without any other keys in the configuration object,
  // then the patterns act as global ignores.
  {
    // An array of glob patterns indicating the files that the configuration
    // object should not apply to. If not specified, the configuration
    // object applies to all files matched by files.
    ignores: [
      'build/**/*.*',
    ],
  },

  eslint.configs.recommended,
  ...tseslint.configs.recommended,

  {
    // An array of glob patterns indicating the files that the configuration
    // object should apply to. If not specified, the configuration object
    // applies to all files matched by any other configuration object.
    files: [
      './src/**/*.ts',
      './src/**/*.tsx'
    ],


    rules: {
      '@typescript-eslint/no-unused-vars': [
        "warn",
        {
          "argsIgnorePattern": "^_"
        }
      ]
    }
  }

);

Linting will now be executed as a part of the check command and, therefore, as a part of the build process.

Summary

Now, you have activated linting - and only one step remains. Prepare your project for testing.


Contents

Contents