@coderdkai/eslint-config

Shared ESLint configuration for the Learn UI monorepo.

Installation

pnpm add -D @coderdkai/eslint-config

Usage

For New Projects (ESLint Flat Config)

Create an eslint.config.js file in your project root:

import config from '@coderdkai/eslint-config';

export default config;

For Legacy Projects (.eslintrc format)

Create an .eslintrc.js file in your project root:

module.exports = {
  extends: ['@coderdkai/eslint-config/legacy'],
  // Add your custom rules here
};

Or use .eslintrc.json:

{
  "extends": ["@coderdkai/eslint-config/legacy"]
}

What's Included

This configuration includes:

• Base Configuration: Built on top of @icebreakers/eslint-config (which extends @antfu/eslint-config)
• Vue 3 Support: Optimized rules for Vue 3 + Composition API
• TypeScript Support: Full TypeScript linting with recommended rules
• Prettier Integration: Compatible with Prettier formatting
• TailwindCSS Support: Linting rules for TailwindCSS classes
• Test Files Support: Special rules for Vitest/Jest test files
• Monorepo Optimized: Configured for workspace environments
• Dual Format Support: Both modern flat config and legacy .eslintrc formats

Supported File Types

• .js, .ts - JavaScript and TypeScript files
• .vue - Vue Single File Components
• .json - JSON files (with formatting)
• .md - Markdown files (with formatting)

Rules Overview

This configuration inherits all rules from @icebreakers/eslint-config, which includes:

Vue Rules (from @antfu/eslint-config)

• Modern Vue 3 + Composition API best practices
• Component naming conventions
• Template and script organization
• Accessibility considerations

TypeScript Rules

• Strict type checking
• Import/export optimization
• Modern JavaScript/TypeScript features
• Unused code detection

Code Style Rules

• Consistent formatting (integrated with Prettier)
• Import sorting and organization
• Modern syntax preferences
• TailwindCSS class validation

Environment-Specific Rules

• Development vs production console handling
• Test file specific rules (Vitest/Jest)
• Configuration file exceptions

For detailed rule information, see the base configuration documentation.

Overrides

The configuration includes specific overrides for:

• Vue files: Disables no-undef rule (handled by Vue compiler)
• Test files: Relaxed rules for test environments
• Config files: Allows console statements

Ignored Patterns

The following patterns are ignored by default:

• dist/
• node_modules/
• coverage/
• *.d.ts
• storybook-static/
• .turbo/
• build/
• .output/
• public/

Extending the Configuration

Adding Custom Rules

// eslint.config.js (Flat Config)
import config from '@coderdkai/eslint-config';

export default [
  ...config,
  {
    rules: {
      // Your custom rules
      'no-console': 'error',
    },
  },
];

// .eslintrc.js (Legacy)
module.exports = {
  extends: ['@coderdkai/eslint-config/legacy'],
  rules: {
    // Your custom rules
    'no-console': 'error',
  },
};

Project-Specific Ignores

// eslint.config.js
import config from '@coderdkai/eslint-config';

export default [
  ...config,
  {
    ignores: ['custom-build/**/*'],
  },
];

Migration Guide

From .eslintrc to Flat Config

1. Remove your .eslintrc.* files
2. Create eslint.config.js:

   import config from '@coderdkai/eslint-config';
   export default config;

3. Update your package.json scripts if needed

From Other Configs

1. Remove old ESLint config dependencies
2. Install @coderdkai/eslint-config
3. Update your configuration file to extend this config

Troubleshooting

Common Issues

1. Module not found: Ensure you're using the correct import/require syntax
2. Parsing errors: Check that your files are using supported syntax
3. Rule conflicts: Custom rules may override the base configuration

Getting Help

• Check the Learn UI documentation
• Review the base configuration at @icebreakers/eslint-config
• Open an issue in the Learn UI repository

License

MIT