Question 1

How to set up Canonical ESLint config with TypeScript?

Accepted Answer

Extend from `canonical/auto` in your eslint.config.ts file and use typescript-eslint, as shown in the usage example. This automatically applies TypeScript-specific rules without manual configuration.

Question 2

Canonical vs Airbnb ESLint: which is better?

Accepted Answer

Canonical offers more comprehensive rule coverage and framework-specific rulesets, while Airbnb is more established but less extensive. Canonical can be layered with Airbnb for extended coverage, but it might overrule some Airbnb preferences.

Question 3

How to override specific rules in Canonical config?

Accepted Answer

Use ESLint overrides in your configuration file to fine-tune rules for specific file patterns, similar to the example in the `canonical/auto` section. This allows customizations without disabling the entire ruleset.

Question 4

Does Canonical work with Prettier out of the box?

Accepted Answer

Yes, but with caveats. The `canonical/prettier` ruleset integrates Prettier via ESLint, but it ignores local .prettierrc files, so you must accept Canonical's formatting defaults or avoid this ruleset.

Question 5

Why is Canonical ESLint slow on first run?

Accepted Answer

It lints all files with extensive rules, but enabling `--cache` dramatically improves subsequent runs by only checking changed files. The benchmark shows caching reduces time from minutes to seconds.

Question 6

How to use Canonical with Next.js projects?

Accepted Answer

Extend from `canonical/auto` and ensure it includes the Next.js ruleset via overrides for relevant files, or manually add `canonical/next` to your configuration for framework-specific linting.

Canonical

What is Canonical?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions