CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-eslint-config-xo-typescript

ESLint shareable config for TypeScript to be used with eslint-config-xo

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

ESLint Config XO TypeScript

ESLint Config XO TypeScript is a comprehensive ESLint shareable configuration specifically designed for TypeScript projects. It extends eslint-config-xo and provides strict typing conventions, coding standards, and stylistic rules optimized for modern TypeScript development with ESM modules.

Package Information

  • Package Name: eslint-config-xo-typescript
  • Package Type: npm
  • Language: JavaScript (TypeScript configurations)
  • Installation: npm install --save-dev eslint-config-xo-typescript
  • Node.js: >=20
  • Peer Dependencies: eslint >=9.33.0, typescript >=5.5.0

Core Imports

import xoTypeScript from 'eslint-config-xo-typescript';

For space-based indentation variant:

import xoTypeScriptSpace from 'eslint-config-xo-typescript/space';

Basic Usage

Standalone ESLint Configuration

// eslint.config.js
import xoTypeScript from 'eslint-config-xo-typescript';

export default [
  ...xoTypeScript,
];

With Space Indentation

// eslint.config.js
import xoTypeScriptSpace from 'eslint-config-xo-typescript/space';

export default [
  ...xoTypeScriptSpace,
];

With XO Linter

XO has built-in support for TypeScript using this package automatically, so no additional configuration is needed when using XO.

Architecture

ESLint Config XO TypeScript is built around several key components:

  • Base Configuration: Extends eslint-config-xo for JavaScript fundamentals
  • TypeScript Integration: Uses typescript-eslint for TypeScript-specific parsing and rules
  • Stylistic Rules: Integrates @stylistic/eslint-plugin for formatting and style consistency
  • Naming Conventions: Comprehensive naming rules for variables, functions, classes, and types
  • File-specific Overrides: Special handling for .d.ts, test files, and TSX files

Capabilities

Main Configuration

The primary ESLint configuration array with comprehensive TypeScript rules and tab-based indentation.

/**
 * Default export providing complete TypeScript ESLint configuration
 * Includes TypeScript-specific rules, stylistic formatting, and naming conventions
 * Uses tab-based indentation by default
 */
declare const config: ESLintConfig[];
export default config;

interface ESLintConfig {
  plugins?: Record<string, ESLintPlugin>;
  languageOptions?: LanguageOptions;
  rules?: Record<string, ESLintRuleConfig>;
  files?: string[];
  ignores?: string[];
}

interface LanguageOptions {
  sourceType?: 'module' | 'script';
  parser?: ESLintParser;
  parserOptions?: ParserOptions;
}

interface ParserOptions {
  projectService?: boolean;
  warnOnUnsupportedTypeScriptVersion?: boolean;
  ecmaFeatures?: {
    jsx?: boolean;
  };
}

interface ESLintPlugin {
  rules?: Record<string, ESLintRule>;
  configs?: Record<string, any>;
  processors?: Record<string, any>;
}

interface ESLintParser {
  parse: (text: string, options: any) => any;
  parseForESLint?: (text: string, options: any) => any;
}

interface ESLintRule {
  meta?: RuleMeta;
  create: (context: any) => any;
}

interface RuleMeta {
  type?: 'problem' | 'suggestion' | 'layout';
  docs?: {
    description?: string;
    recommended?: boolean;
    url?: string;
  };
  fixable?: 'code' | 'whitespace';
  schema?: any[];
}

type ESLintRuleConfig = 'error' | 'warn' | 'off' | [string, ...any[]];

Key Features:

  • 130+ TypeScript-specific rules covering type checking, safety, and best practices
  • Comprehensive naming conventions enforcing camelCase/PascalCase patterns
  • Stylistic rules for consistent formatting (tabs, semicolons, quotes, spacing)
  • JSX support with TypeScript integration
  • File-specific rule overrides for declaration files and tests
  • Project service integration for improved performance with large codebases
  • Integration with three key ESLint plugins: typescript-eslint, @stylistic, and eslint-config-xo

Space Configuration Variant

Alternative configuration using 2-space indentation instead of tabs, while maintaining all other rules and settings.

/**
 * Space variant export providing the same TypeScript configuration
 * but with 2-space indentation instead of tabs
 * Imports and extends the main configuration
 */
declare const spaceConfig: ESLintConfig[];
export default spaceConfig;

Usage Pattern: The space configuration imports the main configuration and overrides only the indentation rule:

import eslintConfigXo from './index.js';

export default [
  ...eslintConfigXo,
  {
    rules: {
      '@stylistic/indent': ['error', 2, { SwitchCase: 1 }],
    },
  },
];

Rule Categories

TypeScript-Specific Rules

The configuration includes comprehensive TypeScript rules covering:

  • Type Safety: @typescript-eslint/await-thenable, @typescript-eslint/no-unsafe-*
  • Best Practices: @typescript-eslint/prefer-nullish-coalescing, @typescript-eslint/prefer-optional-chain
  • Code Quality: @typescript-eslint/no-floating-promises, @typescript-eslint/switch-exhaustiveness-check
  • Type Definitions: @typescript-eslint/consistent-type-definitions, @typescript-eslint/consistent-type-imports

Naming Conventions

Strict naming convention rules with different patterns for different code elements:

interface NamingConventionConfig {
  // Variables and functions: strictCamelCase (+ StrictPascalCase for TSX)
  selector: ['variable', 'function', 'classProperty', 'objectLiteralProperty', 'parameterProperty', 'classMethod', 'objectLiteralMethod', 'typeMethod', 'accessor'];
  format: ['strictCamelCase'] | ['strictCamelCase', 'StrictPascalCase'];
  leadingUnderscore?: 'allowSingleOrDouble';
  trailingUnderscore?: 'allow';
  
  // Types, classes, interfaces: StrictPascalCase
  typeLike: {
    format: ['StrictPascalCase'];
  };
  
  // Boolean variables: prefixed with is/has/can/should/will/did
  booleans: {
    format: ['StrictPascalCase'];
    prefix: ['is', 'has', 'can', 'should', 'will', 'did'];
  };
}

Stylistic Rules

Formatting and style rules provided by @stylistic/eslint-plugin:

  • Indentation: Tabs (main) or 2 spaces (space variant)
  • Quotes: Single quotes enforced
  • Semicolons: Always required
  • Braces: 1TBS style, no single-line blocks
  • Spacing: Consistent spacing around operators, functions, objects

File-Specific Overrides

The configuration includes special rule overrides for different file types:

interface FileOverrides {
  // TypeScript declaration files
  '**/*.d.ts': {
    rules: {
      '@typescript-eslint/no-unused-vars': 'off';
    };
  };
  
  // TypeScript test definition files
  '**/*.test-d.ts': {
    rules: {
      '@typescript-eslint/no-unsafe-call': 'off';
      '@typescript-eslint/no-confusing-void-expression': 'off';
    };
  };
  
  // TSX files (React TypeScript)
  '**/*.tsx': {
    rules: {
      // Enhanced naming conventions allowing PascalCase for components
    };
  };
}

Integration Patterns

Extending the Configuration

// eslint.config.js
import xoTypeScript from 'eslint-config-xo-typescript';

export default [
  ...xoTypeScript,
  {
    // Override or add additional rules
    rules: {
      '@typescript-eslint/explicit-function-return-type': 'error',
      'custom-rule': 'warn',
    },
  },
];

Project-Specific Overrides

// eslint.config.js
import xoTypeScript from 'eslint-config-xo-typescript';

export default [
  ...xoTypeScript,
  {
    files: ['src/legacy/**/*.ts'],
    rules: {
      '@typescript-eslint/no-explicit-any': 'off',
    },
  },
];

Dependencies Integration

The configuration automatically integrates with its dependencies:

  • eslint-config-xo: Provides base JavaScript rules and configuration
  • typescript-eslint: Supplies TypeScript-specific parser and rules
  • @stylistic/eslint-plugin: Provides formatting and stylistic rules

These dependencies are automatically configured and don't require separate setup when using this package.

Plugin Integration Details

/**
 * Core plugins integrated into the configuration
 */
interface ConfigurationPlugins {
  '@typescript-eslint': TypeScriptESLintPlugin;
  '@stylistic': StylisticESLintPlugin;
}

interface TypeScriptESLintPlugin extends ESLintPlugin {
  parser: ESLintParser;
  plugin: ESLintPlugin;
  config: (...configs: any[]) => ESLintConfig[];
}

interface StylisticESLintPlugin extends ESLintPlugin {
  // Stylistic formatting rules for consistent code style
  rules: {
    'brace-style': ESLintRule;
    'comma-dangle': ESLintRule;
    'comma-spacing': ESLintRule;
    'indent': ESLintRule;
    'quotes': ESLintRule;
    'semi': ESLintRule;
    // ... and many more stylistic rules
  };
}

Common Usage Patterns

For Library Development

// eslint.config.js - Strict configuration for library code
import xoTypeScript from 'eslint-config-xo-typescript';

export default [
  ...xoTypeScript,
  {
    files: ['src/**/*.ts'],
    rules: {
      '@typescript-eslint/explicit-function-return-type': 'error',
      '@typescript-eslint/no-explicit-any': 'error',
    },
  },
];

For Application Development

// eslint.config.js - Balanced configuration for application code
import xoTypeScript from 'eslint-config-xo-typescript';

export default [
  ...xoTypeScript,
  {
    files: ['src/**/*.{ts,tsx}'],
    rules: {
      '@typescript-eslint/no-explicit-any': 'warn',
      '@typescript-eslint/prefer-readonly': 'warn',
    },
  },
  {
    files: ['**/*.test.{ts,tsx}'],
    rules: {
      '@typescript-eslint/no-unsafe-assignment': 'off',
      '@typescript-eslint/no-unsafe-member-access': 'off',
    },
  },
];

With Custom Parser Options

// eslint.config.js - Configuration with custom TypeScript project settings
import xoTypeScript from 'eslint-config-xo-typescript';

export default [
  ...xoTypeScript,
  {
    languageOptions: {
      parserOptions: {
        projectService: {
          allowDefaultProject: ['*.js'],
          defaultProject: 'tsconfig.json',
        },
      },
    },
  },
];

Install with Tessl CLI

npx tessl i tessl/npm-eslint-config-xo-typescript
Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/eslint-config-xo-typescript@9.0.x
Publish Source
CLI
Badge
tessl/npm-eslint-config-xo-typescript badge