6.0.3 • Published 1 month ago

eslint-config-beslogic

Licence

MIT

Version

6.0.3

Deps

Size

185 kB

Vulns

Weekly

Install scriptsThis package runs scripts during installation (preinstall/install/postinstall)

Summary Dependency Versions

Eslint Config Beslogic

Installation and usage

Run npm i --save-dev eslint-config-beslogic

Depending on your needs, you will need to also install other peer dependencies for linting.

In your eslint.config.* file, simply extend our presets appropriate for your project.

For stylistic rules, it is highly recommended to use a dedicated formatter over ESLint. Read more here: https://typescript-eslint.io/users/what-about-formatting/
We assume dprint and don't enable any rules it covers by default. If you're not using a formatter, a stylistic.mjs configuration is offered below.

Parallel configurations

These are configuration files you'll have to update manually to best work with these presets.

`package.json`

Read the package.json section of our Shared Configs for one-liner shortcut scripts you can use.

Base `tsconfig.json`

Extend the following in your base tsconfig.json (follow link for more details):

typescript@>=5.6:

"extends": ["eslint-config-beslogic/tsconfig.5.6.json"],

typescript@>=5.0:

"extends": ["eslint-config-beslogic/tsconfig.5.0.json"],

TypeScript's implicit include skips dot-directories, so .azuredevops, .github, etc. are left out (no type-check, no lint). A base config can't fix this (child include replaces, not merges). Add the dot-dirs you need to your own tsconfig.json:

"include": ["**/*", ".azuredevops/**/*", ".github/**/*"]

"No Unchecked Indexed Access" makes index accesses even stricter. You may not want it in your project or in your tests. You can disable it with "compilerOptions": { "noUncheckedIndexedAccess": false }.

If using experimental decorators (likely for an Angular project), you still need to set

"compilerOptions": { 
  "emitDecoratorMetadata": true,
  "experimentalDecorators": true,
}

If deploying / bundling with an Angular npm package, also set angularCompilerOptions": { "strictMetadataEmit": true }.

`.vscode/settings.json` and `.vscode/extensions.json`

Read and copy the sections for the languages you use from Beslogic/shared-configs/.vscode.

`.dprint.jsonc`

Add the following into your .dprint.jsonc at the root of your git project (even if you have multiple workspaces):

{
  // https://dprint.dev/config/#extending-a-different-configuration-file
  "extends": "https://raw.githubusercontent.com/Beslogic/shared-configs/<hash>/.dprint.jsonc"
}

Read the dprint section of our Shared Configs for more information.

If also using json-like.mjs preset extend from https://raw.githubusercontent.com/Beslogic/shared-configs/main/.dprint-json-like.jsonc instead.

PR Autofixes

We've stopped attempting to support pre-commit.ci.
Read the PR Autofixes section of our Shared Configs for an explanation and alternatives.

Patched packages

The following packages cause problems or have other type-safety issues that are automatically patched out by eslint-config-beslogic on install. To see the complete logs, add foreground-scripts=true to a root .npmrc file, or run npm install with --foreground-scripts.

NX/NRWL

NX has a reusable add-linting generator that adds configuration that hides our own and/or conflicts with our best practices. We automatically patch-out that NX generator.

If you have a project that used NX before also using eslint-config-beslogic@>=1.5.2, make sure to remove all @nrwl/* and @angular-eslint/template/process-inline-templates entries from "extends" in all eslint configuration files. You can keep entries generated under "rules".

NX also doesn't support trailing commas in jsonc files. You'll have to make sure that your configurations contains none (and go upvote the referenced issue!).

Angular Material

Angular Material's MatDialogRef defaults it dialog result generic to any. This breaks type safety and is automatically patched out since eslint-config-beslogic@1.5.2.

Presets

Below are all the different configurations you can extend from. You can mix and match as you want if a predefined configuration does not exist for your specific stack.

Examples

React (w/ or w/o TypeScript)

import { defineConfig } from 'eslint/config';
import beslogicExtraStrict from 'eslint-config-beslogic/extra-strict.mjs'
import beslogicReact from 'eslint-config-beslogic/react.mjs'

export default defineConfig(
  beslogicReact,
  beslogicExtraStrict,
  // Your configs here
  {...}
)

Angular

import { defineConfig } from 'eslint/config';
import beslogicAngular from 'eslint-config-beslogic/angular.mjs'
import beslogicExtraStrict from 'eslint-config-beslogic/extra-strict.mjs'

export default defineConfig(
  beslogicAngular,
  beslogicExtraStrict,
  // Your configs here
  {...}
)

Frameworkless TypeScript w/o dprint

import { defineConfig } from 'eslint/config';
import beslogicExtraStrict from 'eslint-config-beslogic/extra-strict.mjs'
import beslogicBase from 'eslint-config-beslogic/base.mjs'
import beslogicStylistic from 'eslint-config-beslogic/stylistic.mjs'

export default defineConfig(
  beslogicBase,
  beslogicExtraStrict,
  beslogicStylistic,
  // Your configs here
  {...}
)

`index.mjs`

Default preset, alias / re-exports base.mjs.

`jest.mjs`

Jest and Testing Library configs. Is already extended by base.mjs for all *spec.[jt]s and *.test.[jt]sx files, as well as *.[jt]s and *.[jt]sx files inside of __tests__ folders. You should not need to extend from this configuration unless you want to add it to a test file that is not automatically picked up by the naming convention.

`base.mjs`

Basic javascript/TypeScript configs, is extended by all other configs except jest.mjs, storybook.mjs and json-like.mjs. Includes TypeScript-specific configs and TSX support.

If you have a non-standard tsconfig.json, you may need custom configurations for settings.import-x/resolver-next: [createTypeScriptImportResolver({project: ...})] and/or settings.parserOptions.projectService.

For the linting to be fully effective, please make sure that your base jsconfig.json/tsconfig.json extends eslint-config-beslogic/tsconfig.X.X.json (see Parallel configurations).

If you want extra strict linting, consider adding the extra-strict.mjs preset.

If you are a writing library, use the following rule:

import { defineConfig } from "eslint/config"
import { explicitModuleBoundaryType } from "eslint-config-beslogic/extra-strict.mjs"

export default defineConfig(
  {
    rules: {
      "@typescript-eslint/explicit-module-boundary-types": explicitModuleBoundaryType
    }
  }
)