eslint-config

A dynamic multi-framework ESLint config.

Features

• Dynamic ESLint rules based on your project's dependencies (React, TypeScript, Svelte, Vue, etc.)
• Installs as a single devDependency: No need to install a bunch of internally extended configs
• Optionally overrides ESLint formatting with Prettier

Supported frameworks/tools

• Astro
• JSON
• Jest
• Node.js
• React (with rules for hooks and a11y)
• Svelte
• TypeScript
• Vue.js

The lint rules that are applied to a given file depend on its extension and whether its associated package is a dependency of your project.

Examples

1. A file with a .tsx extension inside of a project with dependencies on typescript, react, and prettier will be linted with rules for TypeScript, React, and Prettier; but not with rules for Svelte or Vue.
2. A file whose name matches the glob **/*.{spec,test}.{js?(x),ts?(x)} inside of a project with a dependency on jest will be linted with Jest rules.

Node.js

Node.js projects are a special case because node itself is not typically installed as a project level dependency and it does not always use unique file extensions. To address this, this package exports a separate config with additional rules for Node.js. See Usage.

Internally extended configurations

In addition to framework or file specific lint rules, rules common to multiple file types are internally extended from the following configs/plugins:

• confusing-browser-globals
• eslint-config-prettier (only if your project depends on prettier)
• eslint-plugin-eslint-comments
• eslint-plugin-import
• eslint-plugin-no-use-extend-native
• eslint-plugin-promise
• eslint-plugin-regexp
• eslint-plugin-unicorn

Install

Install as a devDependency with your preferred Node.js package manager (npm, pnpm, yarn, etc.):

pnpm i -D @theurgi/eslint-config

Usage

Extend this package in your local eslint config (e.g. .eslintrc.json):

For non Node.js projects:

{
  "extends": ["@theurgi/eslint-config"]
}

For Node.js projects:

This config includes all the non-Node rules plus Node specific rules and overrides.

{
  "extends": ["@theurgi/eslint-config/node"]
}

Editor support

VSCode

For error highlighting and auto-fix-on-save, install the ESLint extension and configure VSCode's settings as follows:

{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },

  "eslint.validate": [
    "astro",
    "javascript",
    "javascriptreact",
    "json",
    "json5",
    "jsonc",
    "svelte",
    "typescript",
    "typescriptreact",
    "vue"
  ]
}

Thanks 🙏

Special thanks to privatenumber whose eslint-config was the primary reference for this package.