配置Vite中Eslint预编译校验遇类型声明缺失问题求助

一、解决"Could not find a declaration file for module 'vite-plugin-eslint'"报错 #

这个错误源于TypeScript无法找到vite-plugin-eslint的类型声明文件，以下是三种可行解决方案：

• 方案1：自定义类型声明文件
  在项目根目录新建types/vite-plugin-eslint.d.ts（或src/vite-plugin-eslint.d.ts），写入内容：

  declare module 'vite-plugin-eslint';
  

  接着在tsconfig.json的include字段中添加该文件路径，确保TypeScript能识别：

  {
    "include": ["src/**/*", "types/**/*"]
  }
  

• 方案2：安装社区类型包（若存在）
  尝试安装第三方维护的类型声明包：

  npm install @types/vite-plugin-eslint --save-dev
  # 或使用yarn/pnpm
  yarn add @types/vite-plugin-eslint -D
  pnpm add @types/vite-plugin-eslint -D
  

  若命令执行失败（说明无社区维护的类型包），直接使用方案1即可。

• 方案3：临时忽略类型错误（不推荐）
  在导入插件的代码行上方添加注释跳过TypeScript检查：

  // @ts-ignore
  import eslintPlugin from 'vite-plugin-eslint';
  

  或在tsconfig.json中关闭noImplicitAny（会降低类型检查严格性，谨慎使用）：

  {
    "compilerOptions": {
      "noImplicitAny": false
    }
  }
  

二、强制修复所有ESLint错误后才能启动项目 #

通过配置vite-plugin-eslint参数，让ESLint检测到错误时直接终止Vite启动进程：

在vite.config.ts（或.js）中配置插件时，开启lintOnStart和failOnError：

import { defineConfig } from 'vite';
import eslintPlugin from 'vite-plugin-eslint';

export default defineConfig({
  plugins: [
    eslintPlugin({
      // 开发服务启动前执行ESLint校验
      lintOnStart: true,
      // 遇到错误时终止进程
      failOnError: true,
      // 可选：遇到警告也终止进程（按需开启）
      failOnWarning: true,
      // 指定需要校验的文件范围
      include: ['src/**/*.ts', 'src/**/*.vue', 'src/**/*.js']
    })
  ]
});

配置完成后，只要项目存在未修复的ESLint错误，Vite启动就会直接失败，直到所有错误被修复。

内容的提问来源于stack exchange，提问作者Nguyễn Ngọc Hải