@hug/eslint-config

ESLint shareable configuration with great defaults

---

Installation

npm install @hug/eslint-config --save-dev

yarn add eslint @hug/eslint-config --dev

See previous installations section for older requirements.

---

Usage

1. Create an eslint.config.mjs file at the root of your project

   Example 1: linter + formatter

   import hug from "@hug/eslint-config";
   
   export default [
       ...(await hug.configs.recommended), // 'recommended (strict) | moderate (less stricter)'
       hug.configs.stylistic,
   ];

   Example 2: linter only

   import hug from "@hug/eslint-config";
   
   export default await hug.configs.moderate;

   Example 3: with overrides

   import hug from "@hug/eslint-config";
   
   export default [
       ...(await hug.configs.recommended),
       hug.configs.stylistic,
   
       // will add or override rules for the current typescript configuration
       ...hug.overrides.typescript({
           "@typescript-eslint/prefer-nullish-coalescing": "off",
       }),
   
       // will add a completely new set of rules
       {
           name: "my-project/defaults/e2e",
           files: ["e2e/**/*.js"],
           plugins: e2ePlugin,
           rules: {
               "e2e-rule": "error",
           },
       },
   
       // will add new ignored files (should always comes last)
       {
           name: "my-project/defaults/ignores",
           ignores: ["**/capacitor.config.ts"],
       },
   ];

2. Modify your existing angular.json

   "architect": {
       "lint": {
           "builder": "@angular-eslint/builder:lint",
           "options": {
               "lintFilePatterns": [
                   "**/*.js",
                   "**/*.json",
                   "**/*.ts",
                   "**/*.html"
               ]
           }
       }
   }

3. Run ng lint

ℹ️ You can also skip steps 2 and 3 and simply run:

eslint *.{js,json,ts,html}

Visual inspector

Eslint has made available a great tool to visually inspect and understand your current configurations.

Go to the project root that contains eslint.config.js and run:

npx @eslint/config-inspector

Rules

This configuration exports a recommended set of rules that enforces good practices.

They may or may not served you well as they are mainly designed to be used by the HUG organization's team.

The rules applies as follow:

Files	Plugins or rules
**/*.{ts,js,mjs,cjs}	eslint, jsdoc, no-loop, prefer-arrow, hug
**/*.{ts,mjs}	simple-import-sort, unused-imports
**/*.{json,jsonc,json5}	json
*	no-secrets
If applicable:
**/*.ts	typescript, rxjs, hug
**/*.{ts,html}	angular, hug
e2e/**/*.ts	cypress, chai-friendly, hug

Previous installations

Prior to version v21.x

Create an .eslintrc.json file at the root of your project

{
    "root": true,
    "extends": [
        /**
         *  Possible values: 'recommended (strict) | moderate (less stricter)'
         */
        "@hug/eslint-config/recommended"
    ]
}

Prior to version v20.2.0

Create a tsconfig.eslint.json file at the root of your project

{
    "extends": "./tsconfig.json",
    "compilerOptions": {
        "types": [
            "node",
            "jasmine"
            //
            // In case you are using WebdriverIO
            //   "@wdio/globals/types"
            //
            // In case you are using Cypress
            //   "cypress"
            //
            // Any other types that are required by your tests
            //   ...
        ]
    },
    "include": ["src/**/*.ts", "e2e/**/*.ts"]
}

For Angular >= 10.x <= 11.x

npm install @hug/[email protected] --save-dev

yarn add [email protected] @hug/[email protected] --dev

Migrating from tslint

1. Remove tslint and codelyzer from your dependencies
2. Remove any tslint.json configuration files
3. Add eslint as a dev dependency
4. Have a look at our Angular project example and modify all your tsconfig files accordingly

Development

See the developer docs.

Contributing

> Want to Help?

Want to file a bug, contribute some code or improve documentation? Excellent!

But please read up first on the guidelines for contributing, and learn about submission process, coding rules and more.

> Code of Conduct

Please read and follow the Code of Conduct, and help us keep this project open and inclusive.

Credits

Copyright (C) 2021 HUG - Hôpitaux Universitaires Genève