or run

npx @tessl/cli init

Version

Tile

Overview

Evals

Files

docs

auto-configuration.md core-configurations.md framework-configurations.md index.md testing-configurations.md utility-configurations.md

tile.json

Utility Configurations

Additional ESLint configurations for specific tools, libraries, and file types. These configurations enhance code quality and consistency across various aspects of development workflows.

Capabilities

Prettier Configuration

Integration configuration for Prettier formatting that applies Prettier rules through ESLint while maintaining compatibility with Canonical rules.

/**
 * Prettier integration ESLint configuration
 * Includes plugin: prettier
 * Applies Prettier formatting as ESLint rules
 */
interface PrettierConfiguration {
  recommended: ESLintConfig;
}

declare const prettier: PrettierConfiguration;

Usage Examples:

import * as canonical from 'eslint-config-canonical';
import * as prettier from 'eslint-config-canonical/prettier';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  canonical.recommended,
  prettier.recommended // Apply last to override conflicting rules
);

Key Features:

Prettier formatting as ESLint rules
Compatibility with Canonical style rules
Automatic conflict resolution
IDE integration support

JSDoc Configuration

Configuration for JSDoc documentation with comprehensive documentation rules and type checking integration.

/**
 * JSDoc documentation ESLint configuration
 * Includes plugin: jsdoc
 * Enforces documentation standards and JSDoc syntax
 */
interface JSDocConfiguration {
  recommended: ESLintConfig;
}

declare const jsdoc: JSDocConfiguration;

Usage Examples:

import * as jsdoc from 'eslint-config-canonical/jsdoc';
import tseslint from 'typescript-eslint';

export default tseslint.config({
  files: ['src/**/*.{js,ts}'],
  ...jsdoc.recommended,
});

Key Features:

JSDoc syntax validation
Documentation completeness checks
Type annotation consistency
API documentation standards

JSON Configuration

Configuration for JSON file linting with syntax validation and formatting rules.

/**
 * JSON file ESLint configuration
 * Includes plugin: jsonc
 * Applies to: **/*.json files
 */
interface JSONConfiguration {
  recommended: ESLintConfig;
}

declare const json: JSONConfiguration;

Usage Examples:

import * as json from 'eslint-config-canonical/json';
import tseslint from 'typescript-eslint';

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

Key Features:

JSON syntax validation
Formatting consistency
Schema validation support
Comment handling (for JSON with comments)

YAML Configuration

Configuration for YAML file linting with syntax validation and style consistency.

/**
 * YAML file ESLint configuration
 * Includes plugin: yml
 * Applies to: **/*.{yml,yaml} files
 */
interface YAMLConfiguration {
  recommended: ESLintConfig;
}

declare const yaml: YAMLConfiguration;

Usage Examples:

import * as yaml from 'eslint-config-canonical/yaml';
import tseslint from 'typescript-eslint';

export default tseslint.config({
  files: ['**/*.{yml,yaml}'],
  ...yaml.recommended,
});

Key Features:

YAML syntax validation
Indentation consistency
Key ordering rules
Multi-document support

Lodash Configuration

Configuration for Lodash utility library with performance optimizations and best practice patterns.

/**
 * Lodash utility library ESLint configuration
 * Includes plugin: lodash
 * Optimizes Lodash usage patterns and performance
 */
interface LodashConfiguration {
  recommended: ESLintConfig;
}

declare const lodash: LodashConfiguration;

Usage Examples:

import * as lodash from 'eslint-config-canonical/lodash';
import tseslint from 'typescript-eslint';

export default tseslint.config({
  files: ['**/*.{js,ts}'],
  ...lodash.recommended,
});

Key Features:

Performance optimization rules
Consistent method usage
Tree-shaking friendly patterns
Native alternative suggestions

Zod Configuration

Configuration for Zod schema validation library with schema definition best practices.

/**
 * Zod schema validation ESLint configuration
 * Includes plugin: zod
 * Enforces Zod schema best practices
 */
interface ZodConfiguration {
  recommended: ESLintConfig;
}

declare const zod: ZodConfiguration;

Usage Examples:

import * as zod from 'eslint-config-canonical/zod';
import tseslint from 'typescript-eslint';

export default tseslint.config({
  files: ['**/*.{js,ts}'],
  ...zod.recommended,
});

Key Features:

Schema definition consistency
Validation pattern optimization
Type inference best practices
Error handling patterns

Regular Expression Configuration

Configuration for regular expression usage with security, performance, and maintainability rules.

/**
 * Regular expression ESLint configuration
 * Includes plugin: regexp
 * Enforces regex best practices and security
 */
interface RegExpConfiguration {
  recommended: ESLintConfig;
}

declare const regexp: RegExpConfiguration;

Usage Examples:

import * as regexp from 'eslint-config-canonical/regexp';
import tseslint from 'typescript-eslint';

export default tseslint.config({
  files: ['**/*.{js,ts}'],
  ...regexp.recommended,
});

Key Features:

ReDoS (Regular expression Denial of Service) prevention
Performance optimization
Readability improvements
Security best practices

Integration Patterns

Documentation-Heavy Project

import * as canonical from 'eslint-config-canonical';
import * as typescript from 'eslint-config-canonical/typescript';
import * as jsdoc from 'eslint-config-canonical/jsdoc';
import * as prettier from 'eslint-config-canonical/prettier';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  canonical.recommended,
  
  // TypeScript with documentation
  {
    files: ['**/*.{ts,tsx}'],
    ...typescript.recommended,
  },
  
  // JSDoc for all source files
  {
    files: ['src/**/*.{js,ts}'],
    ...jsdoc.recommended,
  },
  
  // Prettier formatting (last)
  prettier.recommended
);

Configuration Files Project

import * as canonical from 'eslint-config-canonical';
import * as json from 'eslint-config-canonical/json';
import * as yaml from 'eslint-config-canonical/yaml';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  canonical.recommended,
  
  // JSON configuration files
  {
    files: ['**/*.json', '.vscode/*.json'],
    ...json.recommended,
  },
  
  // YAML configuration files
  {
    files: ['**/*.{yml,yaml}', '.github/**/*.{yml,yaml}'],
    ...yaml.recommended,
  }
);

Utility-Heavy Codebase

import * as canonical from 'eslint-config-canonical';
import * as typescript from 'eslint-config-canonical/typescript';
import * as lodash from 'eslint-config-canonical/lodash';
import * as zod from 'eslint-config-canonical/zod';
import * as regexp from 'eslint-config-canonical/regexp';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  canonical.recommended,
  
  // TypeScript support
  {
    files: ['**/*.{ts,tsx}'],
    ...typescript.recommended,
  },
  
  // Utility libraries
  {
    files: ['src/**/*.{js,ts}'],
    ...lodash.recommended,
    ...zod.recommended,
    ...regexp.recommended,
  }
);

Utility-Specific Best Practices

Prettier Integration

The Prettier configuration should always be applied last to override any conflicting formatting rules:

// ✅ Correct - Prettier last
export default tseslint.config(
  canonical.recommended,
  typescript.recommended,
  prettier.recommended // Applied last
);

// ❌ Incorrect - Prettier not last
export default tseslint.config(
  canonical.recommended,
  prettier.recommended,
  typescript.recommended // May conflict with Prettier
);

JSDoc Documentation Patterns

/**
 * ✅ Correct - Complete JSDoc documentation
 * Calculate the area of a rectangle
 * @param {number} width - The width of the rectangle
 * @param {number} height - The height of the rectangle
 * @returns {number} The area of the rectangle
 * @throws {Error} When width or height is negative
 */
function calculateArea(width, height) {
  if (width < 0 || height < 0) {
    throw new Error('Dimensions must be positive');
  }
  return width * height;
}

/**
 * ❌ Incorrect - Missing parameter documentation
 * Calculate the area of a rectangle
 * @returns {number} The area
 */
function calculateArea(width, height) {
  return width * height;
}

Lodash Performance Patterns

// ✅ Correct - Tree-shakable imports
import { map, filter } from 'lodash';

const result = map(filter(data, predicate), transform);

// ❌ Incorrect - Full library import
import _ from 'lodash';

const result = _.map(_.filter(data, predicate), transform);

Zod Schema Patterns

// ✅ Correct - Clear, composable schemas
const UserSchema = z.object({
  id: z.string().uuid(),
  name: z.string().min(1).max(100),
  email: z.string().email(),
  age: z.number().int().min(0).max(120),
});

// ❌ Incorrect - Overly complex inline schema
const validateUser = (data: unknown) => {
  return z.object({
    id: z.string().regex(/^[0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12}$/i),
    name: z.string().refine(s => s.length > 0 && s.length <= 100),
    // ... complex inline validations
  }).parse(data);
};

Version

Tile

Files