or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

config-generation.mddev-server-integration.mdextensibility.mdindex.mdmodule-configuration.md
tile.json

tessl/npm-nuxt--eslint

Generate ESLint config from current Nuxt settings

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@nuxt/eslint@1.9.x

To install, run

npx @tessl/cli install tessl/npm-nuxt--eslint@1.9.0

index.mddocs/

@nuxt/eslint

@nuxt/eslint is an all-in-one ESLint integration for Nuxt applications that generates project-aware ESLint flat configuration files. It automatically detects Nuxt project settings and creates appropriate ESLint configurations, with optional development server integration for real-time linting. The module serves as a bridge between Nuxt's development environment and ESLint's code quality checks, offering seamless integration that adapts to the specific requirements of each Nuxt project.

Package Information

  • Package Name: @nuxt/eslint
  • Package Type: npm
  • Language: TypeScript
  • Installation: npm install --save-dev @nuxt/eslint

Core Imports

import { defineNuxtConfig } from "@nuxt/nuxt/config";

Basic Usage

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@nuxt/eslint'],
  eslint: {
    config: {
      autoInit: true,
      configFile: '.nuxt/eslint.config.mjs'
    },
    checker: {
      lintOnStart: true,
      emitWarning: true,
      emitError: true
    }
  }
})

Architecture

@nuxt/eslint is built around several key components:

  • Module Registration: Nuxt module that integrates with the Nuxt build system
  • Config Generation: Automatic generation of ESLint flat configs based on project structure
  • Development Server Integration: Optional real-time linting during development
  • DevTools Integration: ESLint config inspector integration with Nuxt DevTools
  • Hook System: Extensible addon system for custom ESLint configurations

Capabilities

Module Configuration

Core module options and setup for integrating ESLint with Nuxt applications.

interface ModuleOptions {
  /** Options for ESLint flat config generation (.nuxt/eslint.config.mjs) */
  config?: ConfigGenOptions | boolean;
  /** Enable ESLint checker align with dev server or build process */
  checker?: CheckerOptions | boolean;
}

Module Configuration

Config Generation

Automatic ESLint configuration generation based on Nuxt project structure and settings.

interface ConfigGenOptions extends NuxtESLintFeaturesOptions {
  /** File path to the generated ESLint config */
  configFile?: string;
  /** Create `eslint.config.mjs` file automatically if not exists */
  autoInit?: boolean;
  /** Override rootDir for the generated ESLint config */
  rootDir?: string;
  /** Options for DevTools integration */
  devtools?: DevToolsOptions;
}

interface DevToolsOptions {
  /** Enable ESLint config inspector in DevTools */
  enabled?: boolean | 'lazy';
  /** Port for the ESLint config inspector */
  port?: number;
}

Config Generation

Development Server Integration

Real-time ESLint checking during development with Vite or Webpack integration.

interface CheckerOptions {
  /** Use ESLint cache to improve performance */
  cache?: boolean;
  /** ESLint config type */
  configType?: 'flat' | 'eslintrc';
  /** Files to include for linting */
  include?: string[];
  /** Files to exclude from linting */
  exclude?: string[];
  /** ESLint formatter for the output */
  formatter?: string;
  /** Path to the ESLint module */
  eslintPath?: string;
  /** Lint on start */
  lintOnStart?: boolean;
  /** The warnings found will printed */
  emitWarning?: boolean;
  /** The errors found will printed */
  emitError?: boolean;
  /** Run ESLint fix */
  fix?: boolean;
  /** Vite specific options */
  vite?: ViteCheckerOptions;
  /** Webpack specific options */
  webpack?: WebpackCheckerOptions;
}

Development Server Integration

Extensibility

Hook system and addon support for extending ESLint configuration.

interface ESLintConfigGenAddon {
  name: string;
  getConfigs: () => Awaitable<ESLintConfigGenAddonResult | undefined>;
}

interface ESLintConfigGenAddonResult {
  /** Imports statements to add to the generated ESLint config */
  imports?: Import[];
  /** Flat config items, should be stringified lines */
  configs?: string[];
}

type Awaitable<T> = T | Promise<T>;

Extensibility

Types

type Awaitable<T> = T | Promise<T>;

interface Import {
  from: string;
  name: string;
  as?: string;
}

// External types from dependencies
interface NuxtESLintFeaturesOptions {
  /** Setup basic JavaScript, TypeScript and Vue plugins and rules */
  standalone?: boolean;
  /** Enable rules for Nuxt module authors or library authors */
  tooling?: boolean | ToolingOptions;
  /** Enable the import plugin */
  import?: boolean | ImportPluginOptions;
  /** Enable stylistic ESLint rules for formatting and code style check */
  stylistic?: boolean | StylisticCustomizeOptions;
  /** Enable formatters to handling formatting for different file types */
  formatters?: boolean | OptionsFormatters;
  /** Options for Nuxt specific rules */
  nuxt?: NuxtSpecificOptions;
  /** Enable TypeScript support */
  typescript?: boolean | {
    strict?: boolean;
    tsconfigPath?: string;
  };
}

interface ViteCheckerOptions {
  /** Run linting in a worker thread */
  lintInWorker?: boolean;
  [key: string]: any;
}

interface WebpackCheckerOptions {
  /** Context directory for linting */
  context?: string;
  /** Files pattern to lint */
  files?: string[];
  /** Only lint changed files */
  lintDirtyModulesOnly?: boolean;
  [key: string]: any;
}

interface FlatConfigComposer {
  /** Clone the composer */
  clone(): FlatConfigComposer;
  /** Append configurations */
  append(...configs: any[]): FlatConfigComposer;
  /** Execute callback when resolved */
  onResolved(callback: (configs: any[]) => void): FlatConfigComposer;
}

interface NuxtESLintConfigOptionsResolved {
  features: any;
  dirs: any;
}

// Configuration option types from @nuxt/eslint-config/flat
interface ToolingOptions {
  [key: string]: any;
}

interface ImportPluginOptions {
  [key: string]: any;
}

interface StylisticCustomizeOptions {
  [key: string]: any;
}

interface OptionsFormatters {
  [key: string]: any;
}

interface NuxtSpecificOptions {
  [key: string]: any;
}