darkobits / eslint-plugin

⚙️ The ESLint config that @darkobits uses.

ESLint plugin for TypeScript / TypeScript React projects.

Install

npm install --save-dev @darkobits/eslint-plugin

⚠️ Note: This package declares ESLint and the various plugins for which it sets rules as peer dependencies. If you're using NPM 7 or later, you don't need to do anything. If you're using Yarn, PNPm, or an alternative package manager that doesn't automatically install peer dependencies, you'll need to install this package's peer dependencies yourself.

Use

This plugin contains two presets: ts for TypeScript projects and tsx for TypeScript-based React projects.

Modern (Flat) ESLint Configuration

ESLint's new flat configuration format is an array of configuration objects. Configuration presets are therefore arrays of one or more configuration objects that are merged by ESLint.

As such, if you do not need to define any custom rules, ignores, or overrides, you can export a configuration preset directly:

eslint.config.js

export { ts as default } from '@darkobits/eslint-plugin';

or

export { tsx as default } from '@darkobits/eslint-plugin';

If you need to define configuration specific to your project, spread the preset into a new array. Order matters; configuration for files that you want to have globally ignored should precede all other configuration while custom overrides should occur last.

import { ts } from '@darkobits/eslint-plugin';

export default [
  {
    ignores: ['unicorns/**']
  },
  ...ts,
  {
    rules: {
      'max-len': 'off'
    }
  }
];

IDE Integration

To use ESLint's new flat configuration format with VS Code, add the following to the project's settings:

.vscode/settings.json

{
  "eslint.experimental.useFlatConfig": true,
  "eslint.options.overrideConfigFile": "eslint.config.js"
}

Legacy ESLint Configuration

To extend a preset:

.eslintrc.js

module.exports = {
  extends: 'plugin:@darkobits/ts'
};

or

module.exports = {
  extends: 'plugin:@darkobits/tsx'
};