tessl/npm-nuxt--eslint

Generate ESLint config from current Nuxt settings

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Overview

Eval results

Files

Config Generation

Name: tessl/npm-nuxt--eslint
Author: tessl

Automatic ESLint configuration generation based on Nuxt project structure and settings. The module analyzes your Nuxt project and generates a comprehensive ESLint flat configuration file that understands your project's structure, imports, and components.

Capabilities

Config Generation Options

Configuration options for ESLint config generation functionality.

/**
 * Configuration options for ESLint config generation
 * Extends NuxtESLintFeaturesOptions from @nuxt/eslint-config/flat
 */
interface ConfigGenOptions extends NuxtESLintFeaturesOptions {
  /**
   * File path to the generated ESLint config
   * @default '.nuxt/eslint.config.mjs'
   */
  configFile?: string;

  /**
   * Create `eslint.config.mjs` file automatically if not exists
   * @default true
   */
  autoInit?: boolean;

  /**
   * Override rootDir for the generated ESLint config
   * If you generate ESLint config from a different directory, you can set this option
   * @default nuxt.options.rootDir
   */
  rootDir?: string;

  /**
   * Options for DevTools integration
   */
  devtools?: DevToolsOptions;
}

/**
 * DevTools integration options for ESLint config inspector
 */
interface DevToolsOptions {
  /**
   * Enable ESLint config inspector in DevTools
   * @default 'lazy'
   */
  enabled?: boolean | 'lazy';
  
  /**
   * Port for the ESLint config inspector
   * Will auto-detect available port if not specified
   */
  port?: number;
}

Generated Config Structure

The generated ESLint config includes comprehensive project-aware settings.

/**
 * Structure of the generated ESLint configuration
 * Generated at the specified configFile location
 */
interface GeneratedConfig {
  /** ESLint flat configuration options resolved from Nuxt project */
  options: NuxtESLintConfigOptionsResolved;
  
  /** Pre-configured ESLint rules for Nuxt projects */
  configs: FlatConfigComposer;
  
  /** Main function for extending with custom configurations */
  withNuxt: typeof defineFlatConfigs;
  
  /** Re-exported utility for defining flat configs */
  defineFlatConfigs: typeof defineFlatConfigs;
}

The generated .nuxt/eslint.config.mjs file exports these functions and objects:

// Main exported functions from generated config
declare function defineFlatConfigs(...configs: any[]): any[];
declare function withNuxt(...configs: any[]): any[];

// Main exports available in generated .nuxt/eslint.config.mjs
export const options: NuxtESLintConfigOptionsResolved;
export const configs: FlatConfigComposer;
export const withNuxt: typeof defineFlatConfigs;
export const defineFlatConfigs: typeof defineFlatConfigs;

Usage Examples:

// Basic config generation
export default defineNuxtConfig({
  modules: ['@nuxt/eslint'],
  eslint: {
    config: true
  }
})

// Custom config file location
export default defineNuxtConfig({
  modules: ['@nuxt/eslint'],
  eslint: {
    config: {
      configFile: 'eslint/nuxt.config.mjs',
      autoInit: false
    }
  }
})

// DevTools integration settings
export default defineNuxtConfig({
  modules: ['@nuxt/eslint'],
  eslint: {
    config: {
      devtools: {
        enabled: true,
        port: 8080
      }
    }
  }
})

Project Structure Analysis

The config generation analyzes your Nuxt project structure to create appropriate ESLint rules.

/**
 * Directory structure analysis for ESLint configuration
 * Automatically detects Nuxt project layout and conventions
 */
interface NuxtProjectDirs {
  /** Root directory paths */
  root: string[];
  /** Source directory paths */
  src: string[];
  /** Pages directory paths */
  pages: string[];
  /** Components directory paths */
  components: string[];
  /** Components with prefixes */
  componentsPrefixed: string[];
  /** Composables directory paths */
  composables: string[];
  /** Layouts directory paths */
  layouts: string[];
  /** Plugins directory paths */
  plugins: string[];
  /** Middleware directory paths */
  middleware: string[];
  /** Modules directory paths */
  modules: string[];
  /** Server directory paths */
  servers: string[];
}

Auto-initialization

When autoInit is enabled, the module automatically creates a root ESLint config file.

/**
 * Auto-initialization creates eslint.config.mjs if it doesn't exist
 * Only runs if no existing flat config files are found
 */
function initRootESLintConfig(
  nuxt: Nuxt, 
  generateConfigPath: string
): Promise<void>;

The auto-generated root config looks like:

// @ts-check
import withNuxt from './.nuxt/eslint.config.mjs'

export default withNuxt(
  // Your custom configs here
)

Global Variables Integration

The generated config automatically includes global variables from your import registry.

/**
 * Addon for integrating Nuxt import globals into ESLint config
 */
interface ImportGlobalsAddon extends ESLintConfigGenAddon {
  name: 'nuxt:eslint:import-globals';
  getConfigs(): Promise<ESLintConfigGenAddonResult>;
}

Generation Process

Analysis: Project structure is analyzed to identify directories and conventions
Import Collection: Auto-imports and composables are catalogued for global variables
Config Building: ESLint flat config is constructed with project-aware rules
File Writing: Generated config is written to the specified location
Type Generation: TypeScript declarations are generated for ESLint rules
Auto-init: Root config file is created if enabled and not present