ESLint Configuration Package

A comprehensive collection of ESLint configurations for TypeScript, Angular, Jest, RxJS, Storybook, and JSON files.

Features

• TypeScript support with strict rules
• Angular template and component rules
• RxJS best practices and common pitfalls detection
• Jest testing configuration
• Storybook linting rules
• JSON validation
• Project boundaries enforcement
• Code style consistency using @stylistic/eslint-plugin

Usage

1. Install the ESLint configuration package:

npm install lint-config --save-dev

Dependencies

The following dependencies are required based on your usage:

Prettier Integration

npm install prettier eslint-config-prettier --save-dev

Angular Support

npm install angular-eslint --save-dev

TypeScript Support

npm install typescript-eslint --save-dev

Install only the dependencies you need based on which features you plan to use.

2. Create or update the eslint.config.mjs in your project root:

import { base, typescript, boundaries } from '@queue-it/lint-config';

export default [
  ...base,
  ...typescript,
  ...boundaries,
  {
    files: ['**/*.ts'],
    rules: {
      // Add any additional specific rules here
      'import-x/no-unresolved': 'error',
      'import-x/prefer-default-export': 'off'
    }
  }
];

Strict Configurations

The package provides two levels of strict configurations:

Strict Warning Mode (strictWarn)

A set of strict TypeScript and JavaScript rules that emit warnings rather than errors. Ideal for:

• Gradually adopting stricter typing
• Identifying potential type safety issues
• Finding code quality improvements
• Maintaining backward compatibility

Key features:

• Type safety enforcement (no-explicit-any, unsafe operations)
• Explicit type annotations
• Null/undefined safety
• Promise handling
• Code complexity limits
• Modern JavaScript practices

Example usage:

import { base, typescript, strictWarn } from '@queue-it/lint-config';

export default [...base, ...typescript, ...strictWarn];

Strict Error Mode (strictError)

The same rules as strictWarn but configured as errors instead of warnings. Use this for:

• Maximum type safety
• Enforcing best practices
• Maintaining high code quality standards
• New projects or modules

Example usage:

import { strict } from '@queue-it/lint-config';
// or
import { base, typescript, strictError } from '@queue-it/lint-config';

export default [
  ...strict // Includes all recommended configs plus strict error rules
  // or
  ...base,
  ...typescript,
  ...strictError
];

Key Rules Enforced

1. Type Safety

   • No explicit any
   • Safe type assertions
   • No unsafe operations
   • Explicit module boundary types

2. Null Safety

   • Strict null checks
   • No non-null assertions
   • Nullish coalescing
   • Optional chaining

3. Promise Handling

   • No floating promises
   • Async function declarations
   • Proper await usage

4. Code Quality

   • Limited function complexity
   • Maximum function size
   • Parameter limits
   • Early returns
   • No nested ternaries

5. Modern Practices

   • Const preferences
   • Arrow functions
   • Template literals
   • Object shorthand
   • ES modules

Configuration Details

Boundaries Configuration

The package includes a sophisticated boundaries configuration that helps maintain clean architecture:

{
  rules: {
    'boundaries/element-types': [
      'error',
      {
        default: 'disallow',
        rules: [
          {
            from: 'feature',
            allow: ['feature', 'ui', 'domain-logic', 'utils', 'common']
          },
          {
            from: 'domain-logic',
            allow: ['domain-logic', 'data-access', 'utils', 'common']
          },
          {
            from: 'data-access',
            allow: ['data-access', 'utils', 'common']
          },
          {
            from: 'ui',
            allow: ['ui', 'utils', 'common']
          }
        ]
      }
    ]
  }
}

TypeScript Configuration

Includes strict TypeScript rules:

• Explicit member accessibility
• Consistent type imports
• Explicit function return types
• No unused variables
• Naming conventions
• And more...

RxJS Configuration

Enforces RxJS best practices:

• Prefer observers over callbacks
• Finnish notation for observables
• Safe operator usage
• No exposed subjects
• Safe subscription handling

Angular Configuration

Angular-specific rules:

• OnPush change detection
• Template accessibility
• Template best practices
• Attributes ordering
• Control flow preference

Jest Configuration

Jest-specific rules:

• No disabled tests
• No focused tests
• No test complexity

Storybook Configuration

Storybook-specific rules:

• No unused stories
• No focused stories
• No disabled stories

JSON Configuration

Validates JSON files and ensures correct formatting.

Cypress Configuration

Cypress-specific rules:

• No disabled tests
• No focused tests