The Cloudflight ESLint Plugin Typescript provides a configuration of ESLint rules recommended by Cloudflight.
You can find the directory of all rules including their reasoning here.
The following dependencies are required:
"eslint": ">=9.0.0 < 10.0.0"
In your package.json
add the following:
"devDependencies": {
...
"@cloudflight/eslint-plugin-typescript": "<version>",
...
}
Now open your eslint.config.mjs
and add one of the configurations:
import { cloudflightTypescriptConfig } from '@cloudflight/eslint-plugin-typescript';
import { includeIgnoreFile } from '@eslint/compat';
import { dirname, normalize, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
const directory = dirname(fileURLToPath(import.meta.url));
const gitignorePath = normalize(resolve(directory, '.gitignore'));
export default [
includeIgnoreFile(gitignorePath),
...cloudflightTypescriptConfig({
rootDirectory: import.meta.dirname,
}),
];
See Custom Configuration for more complicated project setups.
When executing your next eslint .
it will now validate your code against the cloudflight-recommended rules.
This package also includes configs for formatting typescript.
In your package.json
add the following:
"devDependencies": {
...
"@cloudflight/eslint-plugin-typescript": "<version>",
...
}
Create a new file called eslint.format.mjs
and add the following:
import { cloudflightTypescriptFormatConfig } from '@cloudflight/eslint-plugin-typescript';
import { includeIgnoreFile } from '@eslint/compat';
import { dirname, normalize, resolve } from 'node:path';
import { fileURLToPath } from 'node:url';
const directory = dirname(fileURLToPath(import.meta.url));
const gitignorePath = normalize(resolve(directory, '.gitignore'));
export default [
includeIgnoreFile(gitignorePath),
...cloudflightTypescriptFormatConfig({
rootDirectory: import.meta.dirname,
}),
];
With the command eslint -c eslint.format.mjs .
your project can be checked for formatting violations.
The reason we created another eslint config file just for formatting instead of adding it to the existing one is to separate between linting and formatting, which are two different concerns. Furthermore, with the separation we also gain the ability to fix the formatting automatically before commit. Automatically fixing linting bugs with eslint --fix
is not recommended, since it changes the intent of the code.
To automatically format your code before committing, set up husky and lint-staged with the following content in your package.json
.
{
// ...
"lint-staged": {
"*.ts": "eslint -c eslint.format.mjs --fix"
}
}