Spyrosoft ESlint Config

A set of rules selected by Spyrosoft's engineers as a company standard for frontend projects.

Table of Contents

• Installation
• List of rules
  • General rules
  • Tests rules
  • Naming convention
    • File naming convention
  • Member declaration order
    • Access modifier order
    • Member type order
  • Additonal rules

Installation

In order to use this set of rules in your project, install this package as a dev dependency:

npm i --save-dev @spyrosoft/eslint-config-spyro

Then, set it in your .eslintrc.json file:

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

And that's all, your ESlint rules are now set and ready to go.

List of rules

General rules

• ESlint recommended
• Typescript-eslint recommended
• Unicorn
• React
• React Hooks

Tests rules

Jest recommended, extended by:

| Rule | Description | |---------------------------------|---------------------------------------------------------------------------------------------| | jest/consistent-test-it | forces all top-level tests to use test and all tests nested within describe to use it | | jest/max-nested-describe | enforces a maximum depth to nested describe() calls to 3 | | jest/no-alias-methods | disallow alias methods | | jest/no-duplicate-hooks | disallow duplicate setup and teardown hooks | | jest/no-hooks | allow only afterAll and beforeEach hooks | | jest/no-if | disallow conditional logic | | jest/no-test-return-statement | disallow explicitly returning from tests | | jest/require-top-level-describe | require test cases and hooks to be inside a describe block | | jest/expect-expect | ensure that there is at least one expect call made in a test |

Naming convention

• interfaces - PascalCase, starting with I
• type aliases - PascalCase, starting with T
• variables - CamelCase, PascalCase or UPPER_CASE, consecutive capitals are not allowed
• enums - UPPER_CASE

No trailing or leading underscores allowed in any of the above.

File naming convention

All file names should be in kebab-case.

Member declaration order

Access modifier order

1. public
2. protected
3. private

Member type order

1. static field
2. instance field
3. static method
4. constructor
5. instance method

Additonal rules

| Rule | Description | |-------------------------------------------|------------------------------------------------------------------------------------------------------| | @typescript-eslint/member-delimiter-style | each member should be delimited with a semicolon | | no-else-return | disallow else blocks after return statements in if statements | | unicorn/new-for-builtins | enforce the use of new for all builtins, except String, Number, Boolean, Symbol and BigInt | | unicorn/prefer-switch | prefer switch over multiple else-if | | react/jsx-no-useless-fragment | disallow unnecessary fragments | | react-hooks/exhaustive-deps | validate dependencies of custom Hooks