Auto Configuration

The auto configuration is a special ruleset that intelligently combines multiple ESLint configurations using overrides to apply only relevant rules based on file patterns. This reduces linting time and false positives while providing comprehensive coverage.

Capabilities

Auto Configuration Import

The default export from the auto configuration module that provides a pre-configured combination of essential rulesets.

/**
 * Pre-configured ESLint configuration combining essential rulesets
 * Includes: jsdoc, canonical, typescript, regexp, react, prettier, json, yaml, graphql
 * @returns Array of ESLint flat config objects
 */
declare const auto: ESLintConfig[];

Usage Examples:

// Basic usage (recommended)
import auto from 'eslint-config-canonical/auto';
import tseslint from 'typescript-eslint';

export default tseslint.config(auto);

// With additional overrides
import auto from 'eslint-config-canonical/auto';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  auto,
  {
    // Override specific rules
    rules: {
      'no-console': 'warn',
    },
  }
);

Configuration Composition

The auto configuration internally composes the following configurations in order:

1. jsdoc.recommended: JSDoc documentation rules
2. canonical.recommended: Core Canonical style guide
3. typescript.recommended: TypeScript-specific rules
4. regexp.recommended: Regular expression best practices
5. react.recommended: React framework rules
6. prettier.recommended: Prettier formatting integration
7. json.recommended: JSON file linting
8. yaml.recommended: YAML file linting
9. graphql.recommended: GraphQL query linting

Override Patterns

The auto configuration can be extended with custom overrides for specific use cases:

// Example: Adding accessibility rules for TSX files
import auto from 'eslint-config-canonical/auto';
import * as jsxA11y from 'eslint-config-canonical/jsx-a11y';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  auto,
  {
    files: ['**/*.tsx'],
    ...jsxA11y.recommended,
  }
);

// Example: Adding Vitest rules for test files
import auto from 'eslint-config-canonical/auto';
import * as vitest from 'eslint-config-canonical/vitest';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  auto,
  {
    files: ['**/*.test.{ts,tsx}', '**/*.spec.{ts,tsx}'],
    ...vitest.recommended,
  }
);

File Pattern Targeting

The auto configuration automatically applies different rules based on file patterns:

• JavaScript/TypeScript files (**/*.{js,jsx,ts,tsx}): Core canonical and TypeScript rules
• JSON files (**/*.json): JSON-specific linting rules
• YAML files (**/*.{yml,yaml}): YAML-specific linting rules
• GraphQL files (**/*.{graphql,gql}): GraphQL query validation
• React files (**/*.{jsx,tsx}): React-specific rules and hooks