or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

cli-tool.mdeslint-configs.mdindex.mdprettier-config.mdstylelint-config.md
tile.json

eslint-configs.mddocs/

ESLint Configurations

Comprehensive ESLint configuration system with React, TypeScript, and modern JavaScript support. Provides both strict and lenient rule sets with automatic TypeScript project detection.

Capabilities

Default ESLint Configuration

The default configuration (eslint export) provides a balanced set of rules suitable for most projects.

/**
 * Default ESLint configuration with React and TypeScript support
 * Automatically detects TypeScript projects and applies appropriate rules
 */
const eslint: ESLintConfig;

Usage:

// .eslintrc.js
module.exports = {
  extends: [require.resolve('@umijs/fabric/dist/eslint')],
};

Strict ESLint Configuration

The strict configuration (strictEslint export) provides the same rules as the default but with more stringent enforcement.

/**
 * Strict ESLint configuration (identical to default in current version)
 * Provides comprehensive linting for React and TypeScript projects
 */
const strictEslint: ESLintConfig;

Usage:

const fabric = require('@umijs/fabric');

module.exports = {
  ...fabric.strictEslint,
  rules: {
    // Override specific rules as needed
  },
};

ESLint Configuration Structure

Complete configuration object with all supported properties.

interface ESLintConfig {
  /** Extended configurations */
  extends: string[];
  
  /** Parser for JavaScript files */
  parser: string;
  
  /** ESLint plugins */
  plugins: string[];
  
  /** Environment settings */
  env: {
    browser: boolean;
    node: boolean;
    es6: boolean;
    mocha: boolean;
    jest: boolean;
    jasmine: boolean;
  };
  
  /** Rule configuration */
  rules: Record<string, number | string | [number | string, any]>;
  
  /** Parser and import resolver settings */
  settings: {
    'import/resolver': {
      node: {
        extensions: string[];
      };
    };
    'import/parsers': Record<string, string[]>;
    'import/extensions': string[];
    'import/external-module-folders': string[];
    polyfills: string[];
    react: {
      version: string;
    };
  };
  
  /** TypeScript-specific overrides (when TypeScript detected) */
  overrides?: Array<{
    files: string[];
    parser: string;
    rules: Record<string, any>;
    extends: string[];
  }>;
  
  /** Parser options */
  parserOptions: {
    ecmaFeatures: {
      jsx: boolean;
    };
    babelOptions: {
      presets: string[];
      plugins: Array<string | [string, any]>;
    };
    requireConfigFile: boolean;
    project?: string;
  };
}

TypeScript Integration

Automatically detects TypeScript projects and applies enhanced rules.

/**
 * Checks if current directory contains a TypeScript project
 * @returns {boolean} True if tsconfig.json exists
 */
const isTsProject: boolean;

/**
 * Determines if project has more JavaScript than TypeScript files
 * @param {string} path - Path to analyze (defaults to 'src')
 * @returns {Promise<boolean>} True if more JS files than TS files
 */
function isJsMoreTs(path?: string): Promise<boolean>;

TypeScript-Specific Rules

When TypeScript is detected, additional rules are applied via overrides.

/**
 * TypeScript-specific ESLint rules configuration
 * Contains 160+ rules for TypeScript projects
 */
interface TypeScriptRules {
  // Type-aware rules (enabled when DISABLE_TYPE_AWARE is not set)
  '@typescript-eslint/dot-notation': number;
  '@typescript-eslint/no-throw-literal': number;
  '@typescript-eslint/switch-exhaustiveness-check': number;
  
  // Standard TypeScript rules
  '@typescript-eslint/array-type': string;
  '@typescript-eslint/consistent-type-assertions': number;
  '@typescript-eslint/consistent-type-definitions': number;
  '@typescript-eslint/consistent-type-imports': number;
  '@typescript-eslint/explicit-function-return-type': number;
  '@typescript-eslint/method-signature-style': string;
  '@typescript-eslint/no-confusing-non-null-assertion': string;
  '@typescript-eslint/no-dupe-class-members': string;
  '@typescript-eslint/no-empty-interface': number;
  '@typescript-eslint/no-for-in-array': string;
  '@typescript-eslint/no-invalid-this': number;
  '@typescript-eslint/no-loop-func': string;
  '@typescript-eslint/no-misused-new': string;
  '@typescript-eslint/no-namespace': number;
  '@typescript-eslint/no-non-null-asserted-optional-chain': string;
  '@typescript-eslint/no-parameter-properties': string;
  '@typescript-eslint/no-redeclare': string;
  '@typescript-eslint/no-shadow': string;
  '@typescript-eslint/no-this-alias': string;
  '@typescript-eslint/no-unused-expressions': string;
  '@typescript-eslint/no-unused-vars': [string, any];
  '@typescript-eslint/no-useless-constructor': string;
  '@typescript-eslint/triple-slash-reference': string;
  '@typescript-eslint/type-annotation-spacing': string;
  '@typescript-eslint/typedef': string;
  '@typescript-eslint/unified-signatures': string;
  
  // Disabled base rules that conflict with TypeScript rules
  'no-undef': number;
  'brace-style': string;
  'comma-dangle': string;
  'comma-spacing': string;
  'default-param-last': string;
  'dot-notation': string;
  'func-call-spacing': string;
  indent: string;
  'init-declarations': string;
  'keyword-spacing': string;
  'lines-between-class-members': string;
  'no-array-constructor': string;
  'no-dupe-class-members': string;
  'no-duplicate-imports': string;
  'no-empty-function': string;
  'no-extra-parens': string;
  'no-extra-semi': string;
  'no-implied-eval': string;
  'no-invalid-this': string;
  'no-loop-func': string;
  'no-loss-of-precision': string;
  'no-magic-numbers': string;
  'no-redeclare': string;
  'no-shadow': string;
  'no-throw-literal': string;
  'no-unused-expressions': string;
  'no-unused-vars': string;
  'no-use-before-define': string;
  'no-useless-constructor': string;
  quotes: string;
  'require-await': string;
  'no-return-await': string;
  semi: string;
  'space-before-function-paren': string;
  'space-infix-ops': string;
  camelcase: number;
}

Key TypeScript Rules:

  • Type Safety: Enforces proper type usage and prevents common type-related errors
  • Code Quality: Maintains consistent coding patterns and best practices
  • Import Management: Ensures proper import/export patterns with type imports
  • Class and Interface Design: Enforces consistent class and interface patterns
  • Function Signatures: Requires proper typing for function parameters and return types

React Rules

Comprehensive React and React Hooks support included in all configurations.

// React-specific rules included
interface ReactRules {
  'react/display-name': number;
  'react/jsx-props-no-spreading': number;
  'react/state-in-constructor': number;
  'react/static-property-placement': number;
  'react/destructuring-assignment': string;
  'react/jsx-filename-extension': string;
  'react/no-array-index-key': string;
  'react-hooks/rules-of-hooks': string;
  'react-hooks/exhaustive-deps': string;
  'react/require-default-props': number;
  'react/jsx-fragments': number;
  'react/jsx-wrap-multilines': number;
  'react/prop-types': number;
  'react/forbid-prop-types': number;
  'react/sort-comp': number;
  'react/react-in-jsx-scope': number;
  'react/jsx-one-expression-per-line': number;
  'react/self-closing-comp': number;
  'react/jsx-key': number;
}

Environment Configuration

Supports multiple JavaScript environments and testing frameworks.

interface EnvironmentConfig {
  /** Browser globals available */
  browser: boolean;
  
  /** Node.js globals available */
  node: boolean;
  
  /** ES6 features enabled */
  es6: boolean;
  
  /** Mocha testing framework globals */
  mocha: boolean;
  
  /** Jest testing framework globals */
  jest: boolean;
  
  /** Jasmine testing framework globals */
  jasmine: boolean;
}

Usage Examples:

// Basic TypeScript React project
module.exports = {
  extends: [require.resolve('@umijs/fabric/dist/eslint')],
  rules: {
    // Project-specific overrides
    '@typescript-eslint/no-explicit-any': 'warn',
  },
};

// JavaScript project with custom environment
module.exports = {
  extends: [require.resolve('@umijs/fabric/dist/eslint')],
  env: {
    // Additional environments
    webextensions: true,
  },
};

// Disabling type-aware rules for faster linting
// Set environment variable: DISABLE_TYPE_AWARE=true