@grafana/eslint-config

grafana-eslint-config

Grafana's ESLint config.

Installation

yarn add @grafana/eslint-config --dev

or:

npm install @grafana/eslint-config --save-dev

Don't forget to install peerDependencies.

• Install the correct versions of each package, which are listed by the command:

npm info "@grafana/eslint-config@latest" peerDependencies

If using npm 5+, use this command:

npx install-peerdeps --dev @grafana/eslint-config

If using a different package manager, run npm info "@grafana/eslint-config@latest" peerDependencies to list the peer dependencies and versions. Then run yarn add --dev <dependency1>@<version> <dependency2>@<version> <dependency3>@<version> for the listed peer dependencies.

Configuration (new: eslint.config.js)

From v8.21.0, Eslint introduced a new flat config system where eslint.config.js replaces .eslintrc* as the default config file name. Eslint@8.x supports both systems, while Eslint@9.x only supports the new flat config.

A guide on how to migrate to a flat config can be found here.

The following official blog posts are available for interested parties:

• https://eslint.org/blog/2022/08/new-config-system-part-1/
• https://eslint.org/blog/2022/08/new-config-system-part-2/
• https://eslint.org/blog/2022/08/new-config-system-part-3/

This package contains a single flat config object which can be imported like so:

const grafanaConfig = require("@grafana/eslint-config/flat");

/**
 * @type {Array<import('eslint').Linter.Config>}
 */
module.exports = [
  ...grafanaConfig,
  … /* rest of your config */
];

You are then free to add/override properties.

Note: Our shareable configs does not preconfigure files, ignore, or languageOptions.globals. For most of the cases, you probably want to configure some properties for your project.

const grafanaConfig = require("@grafana/eslint-config/flat");

/**
 * @type {Array<import('eslint').Linter.Config>}
 */
module.exports = [
  {
    ignores: [".github", ".yarn", "**/build/", "**/compiled/", "**/dist/"],
  },
  ...grafanaConfig,
  {
    name: "myproject/defaults",
    files: ["**/*.{ts,tsx,js,jsx}"],
    rules: {
      // add custom rules here.
    },
  },
];

Configuration (legacy: .eslintrc*)

Extend our configuration to get reasonable defaults:

{
  "extends": ["@grafana/eslint-config"]
}

It will automatically handle *.(js|ts|tsx) files.