Custom ESLint Config

Blitz extends the default Next.js eslint config

This configuration is found in .eslintrc.js, and by default is

module.exports = {
  extends: ["blitz"],
}

Extending or replacing the default Blitz ESLint config

You can extend the base Blitz ESLint config, or replace it completely if you need.

There are a few things to remember:

1. We highly recommend extending the base config, as removing it could introduce hard-to-find issues.
2. It's important to note that any rules that are set to "error" will stop the project from building.

In the below example:

• the base config has been extended by a shared ESLint config,
• a new rule has been set that applies to all JavaScript and TypeScript files

module.exports = {
  extends: ["blitz", "shared-config"],
  rules: {
    "additional-rule": "warn",
  },
}

Linting During Builds

When ESLint is detected in your project, Blitz.js fails your production build (blitz build) when errors are present.

If you'd like Blitz.js to produce production code even when your application has ESLint errors, you can disable the built-in linting step completely.

Be sure you have configured ESLint to run in a separate part of your workflow (for example, in CI or a pre-commit hook). Open blitz.config.js and enable the ignoreDuringBuilds option in the eslint config:

// blitz.config.js
module.exports = {
  eslint: {
    ignoreDuringBuilds: true,
  },
}

Core Web Vitals

A stricter next/core-web-vitals rule set can also be added in .eslintrc:

{
  "extends": ["blitz", "next/core-web-vitals"]
}

next/core-web-vitals updates some rules from the base config to error on a number of rules that are warnings by default if they affect Core Web Vitals.