Commons ESLint Plugin

This package contains custom plugins for ESLint in TypeScript projects.

> Note: This plugin uses ESLint 9+ flat config format. If you're migrating from ESLint 8, you'll need to update your configuration to use eslint.config.js instead of .eslintrc.js.

This plugin imposes our coding conventions, including:

- Proper TypeScript naming conventions
- Proper import ordering
- Module aliasing for application code
- Other stylistic and syntactic conventions

$3

``
eslint >= 9.0.0
@typescript-eslint/eslint-plugin >= 8.0.0
@typescript-eslint/parser >= 8.0.0
typescript >= 5.0.0
`

Install

`bash
npm install -D @knightinteractive/eslint-plugin
`

Or install the latest version with the required peer dependencies:

`bash
npm install -D eslint@latest \
@typescript-eslint/eslint-plugin@latest \
@typescript-eslint/parser@latest \
@knightinteractive/eslint-plugin@latest
`

Use the plugin in your ESLint flat config (ESLint 9+):

Create an eslint.config.js (or eslint.config.mjs) file:

`js
import eslintPlugin from '@typescript-eslint/eslint-plugin'
import tseslintParser from '@typescript-eslint/parser'
import { application } from '@knightinteractive/eslint-plugin'

export default [
...application,
{
files: ['/.ts', '/.tsx'],
languageOptions: {
parser: tseslintParser,
parserOptions: {
project: './tsconfig.json',
},
},
plugins: {
'@typescript-eslint': eslintPlugin,
},
rules: {
...eslintPlugin.configs.recommended.rules,
},
},
]
`

Or, for libraries, use the library config:

`js
import eslintPlugin from '@typescript-eslint/eslint-plugin'
import tseslintParser from '@typescript-eslint/parser'
import { library } from '@knightinteractive/eslint-plugin'

export default [
...library,
{
files: ['/.ts', '/.tsx'],
languageOptions: {
parser: tseslintParser,
parserOptions: {
project: './tsconfig.json',
},
},
plugins: {
'@typescript-eslint': eslintPlugin,
},
rules: {
...eslintPlugin.configs.recommended.rules,
},
},
]
`

Configurations in this plugin have the following default settings:

`js
{
languageOptions: {
parser: '@typescript-eslint/parser',
parserOptions: {
sourceType: 'module',
},
},
}
`

To include files that are not part of the actual project (e.g. the src directory) in the linting process, define the languageOptions.parserOptions.project property in your eslint.config.js to use the tsconfig.lint.json file instead of the default tsconfig.json:

> ⚠️ Caution: If you try and include a non-project Javascript file (such as the eslint.config.js itself) in your main tsconfig.json file, it will affect the nesting of your build output. This is why we recommend using a separate tsconfig.lint.json file for linting.

`json
{
"extends": "./tsconfig.json",
"include": [
"./src/*/",
"./test/*/",
"./*.js",
"./.*.js",
"./*.ts"
]
}
`

Then reference it in your eslint.config.js:

`js
import eslintPlugin from '@typescript-eslint/eslint-plugin'
import tseslintParser from '@typescript-eslint/parser'
import { library } from '@knightinteractive/eslint-plugin'

export default [
...library,
{
files: ['/.ts', '/.tsx'],
languageOptions: {
parser: tseslintParser,
parserOptions: {
project: './tsconfig.lint.json',
},
},
plugins: {
'@typescript-eslint': eslintPlugin,
},
rules: {
...eslintPlugin.configs.recommended.rules,
},
},
]
`

The @typescript-eslint/parser module will use the defined Typescript configuration file as a source of truth for which files to include.

Config Sets

This plugin exposes two config sets:
- application - used for application code
- library - used for library code

The difference being that the application configuration imposes the @knightinteractive/prefer-aliased` rule, whereas the library configuration does not (libraries should not use module aliasing at all)

Another difference is in the import ordering, which accounts for the lack of module aliasing in the library configuration.

Rules

Read the rule documentation for more information.