eslint-config-hardcore

eslint-config-hardcore

The most strict (yet practical) ESLint config.

Aims to include as many plugins and rules as possible to make your code extremely consistent and robust.

53 plugins. 1341 rules.

Usage

npm install eslint-config-hardcore --save-dev

Available configs:

• hardcore - base framework-agnostic config
• hardcore/ts - additional config for TypeScript
• hardcore/node- additional config for Node.js
• hardcore/react - additional config for React
• hardcore/react-performance - additional React config with performance rules
• hardcore/vue - additional config for Vue 3/Nuxt 3
• hardcore/react-testing-library - additional config for React Testing Library
• hardcore/jest - additional config for Jest
• hardcore/fp - additional config for functional programming
• hardcore/ts-for-js - additional config for linting JavaScript with typescript-eslint

Example .eslintrc.json for a React project:

{
  "root": true,

  "extends": [
    "hardcore",
    "hardcore/react",
    "hardcore/react-performance",
    "hardcore/react-testing-library",
    "hardcore/jest",
    "hardcore/fp"
  ],

  "env": {
    "browser": true
  },

  "overrides": [
    {
      "files": ["server/**/*.js"],

      "extends": ["hardcore/node"],

      "env": {
        "browser": false
      }
    }
  ]
}

Example .eslintrc.json for a TypeScript React project:

{
  "root": true,

  "extends": [
    "hardcore",
    "hardcore/react",
    "hardcore/react-performance",
    "hardcore/react-testing-library",
    "hardcore/jest",
    "hardcore/fp",
    "hardcore/ts"
  ],

  "parserOptions": {
    "project": true
  },

  "env": {
    "browser": true
  },

  "overrides": [
    {
      "files": ["server/**/*.ts"],

      "extends": ["hardcore/node"],

      "env": {
        "browser": false
      }
    }
  ]
}

Example .eslintrc.json for a Vue 3 project:

{
  "root": true,

  "extends": ["hardcore", "hardcore/vue"],

  "settings": {
    "import/resolver": {
      "alias": {
        "map": [["@", "./src/"]],
        "extensions": [".js", ".vue"]
      }
    }
  }
}

Example .eslintrc.json for a Nuxt 3 project:

{
  "root": true,

  "extends": ["hardcore", "hardcore/vue"],

  "settings": {
    "import/resolver": {
      "alias": {
        "map": [
          ["@", "./"],
          ["#imports", ".nuxt/imports.d.ts"]
        ],

        "extensions": [".js", ".vue"]
      }
    }
  }
}

Example .eslintrc.json for a TypeScript Vue 3 project (depending on project configuration, you might want to change "project": true to "project": "tsconfig.app.json"):

{
  "root": true,

  "extends": ["hardcore", "hardcore/ts", "hardcore/vue"],

  "parserOptions": {
    "project": true
  },

  "overrides": [
    {
      "files": [
        "vite.config.*",
        "vitest.config.*",
        "cypress.config.*",
        "playwright.config.*"
      ],

      "parserOptions": {
        "project": "tsconfig.node.json"
      }
    },

    {
      "files": ["src/**/__tests__/*"],

      "parserOptions": {
        "project": "tsconfig.vitest.json"
      }
    }
  ]
}

Example .eslintrc.json for a TypeScript Nuxt 3 project:

{
  "root": true,

  "extends": ["hardcore", "hardcore/ts", "hardcore/vue"],

  "parserOptions": {
    "project": true
  }
}

Configs

hardcore

Base framework-agnostic config.

Plugin	Enabled rules
ESLint core rules	173
eslint-plugin-unicorn	103
eslint-plugin-regexp	80
eslint-plugin-putout	76
eslint-plugin-sonar	51
eslint-plugin-import	33
eslint-plugin-sonarjs	31
HTML ESLint	22
eslint-plugin-promise	13
eslint-plugin-security	12
eslint-plugin-perfectionist	7
@stylistic/eslint-plugin	7
eslint-plugin-eslint-comments	6
eslint-plugin-sdl	5
eslint-plugin-array-func	3
eslint-plugin-unused-imports	2
eslint-plugin-simple-import-sort	2
eslint-plugin-no-constructor-bind	1
eslint-plugin-no-unsanitized	2
eslint-plugin-no-use-extend-native	1
eslint-plugin-ext	1
eslint-plugin-no-only-tests	1
eslint-plugin-compat	1
eslint-plugin-json¹	1
eslint-plugin-yml¹	1
eslint-plugin-toml¹	1
Total:	645

¹ json/yml/toml plugins actually include several rules, but I consider each plugin as a single "no-invalid" rule.

hardcore/ts

Config for TypeScript.

Plugin	Enabled rules
typescript-eslint	105
eslint-plugin-etc	10
eslint-plugin-total-functions	8
@shopify/eslint-plugin	3
eslint-plugin-sonar	1
eslint-plugin-sort-class-members	1
eslint-plugin-decorator-position	1
eslint-plugin-no-explicit-type-exports	1
eslint-plugin-typescript-compat	1
Total:	131

hardcore/node

Config for Node.js.

Plugin	Enabled rules
eslint-plugin-sonar	53
eslint-plugin-n	34
eslint-plugin-sdl	1
Total:	88

hardcore/react

Config for React.

Plugin	Enabled rules
eslint-plugin-react	74
eslint-plugin-styled-components-a11y	33
eslint-plugin-jsx-a11y	34
eslint-plugin-storybook	14
eslint-plugin-react-form-fields	4
eslint-plugin-ssr-friendly	4
@shopify/eslint-plugin	3
eslint-plugin-react-hook-form	3
eslint-plugin-react-hooks	2
eslint-plugin-sonar	2
eslint-plugin-validate-jsx-nesting	1
eslint-plugin-react-prefer-function-component	1
Total:	175

hardcore/react-performance

Config with performance rules for React.

Plugin	Enabled rules
eslint-plugin-react	4
eslint-plugin-react-perf	4
eslint-plugin-react-usememo	1
Total:	9

hardcore/vue

Config for Vue 3/Nuxt 3.

Plugin	Enabled rules
eslint-plugin-vue	168
eslint-plugin-vuejs-accessibility	20
eslint-plugin-vue-scoped-css	12
eslint-plugin-sonar	1
Total:	201

hardcore/react-testing-library

Config for React Testing Library.

Plugin	Enabled rules
eslint-plugin-testing-library	24
Total:	24

hardcore/jest

Config for Jest.

Plugin	Enabled rules
eslint-plugin-jest	50
eslint-plugin-jest-dom	11
eslint-plugin-jest-formatting	7
Total:	68

hardcore/fp

Config for functional programming.

Plugin	Enabled rules
eslint-plugin-functional	9
Total:	9

hardcore/ts-for-js

Config for linting JavaScript with typescript-eslint.

Plugin	Enabled rules
typescript-eslint	28
eslint-plugin-etc	4
@shopify/eslint-plugin	2
eslint-plugin-sort-class-members	1
eslint-plugin-decorator-position	1
eslint-plugin-typescript-compat	1
Total:	37

Did you know you can lint JavaScript code with typescript-eslint?

Use this config to take advantage of typescript-eslint's advanced type-aware rules (like @typescript-eslint/naming-convention and @typescript-eslint/prefer-optional-chain) without the need to switch to writing TypeScript.

1. First, you'll need to create tsconfig.json in the root of your project. You don't have to specify any options, just {} should do it.
2. Then add hardcore/ts-for-js to the overrides section in your .eslintrc like this:

{
  "extends": ["hardcore"],

  "env": {
    "browser": true
  },

  "overrides": [
    {
      "files": ["*.js"],
      "extends": ["hardcore/ts-for-js"],
      "parserOptions": {
        "project": true
      }
    }
  ]
}

Changelog

License

MIT