Skip to content

常见问题

我应该使用这个插件吗?

大多数情况下不需要。

在 Webpack 使用 eslint-webpack-plugin 是很常见的,而这个插件在 Vite 中做着几乎一样的事情。

但是,我们的 IDE 可以直接显示相对应的校验信息。对于 VS Code,我们只需要添加 ESLint 插件。WebStorm 已经内置了这个功能。此外,我们也可以在命令行或者 CI 中运行 ESLint 来获取反馈。

我们有这么多方法运行 ESLint,没有太大必要再在 Vite 中运行 ESLint,这也就意味着我们在大多数情况下不需要这个插件。

如果你真的很需要查看错误和警告,请尝试启用 lintInWorker 选项,它保持了 Vite 的速度,并在控制台中打印信息。你也可以尝试一下社区内的 @nabla/vite-plugin-eslintvite-plugin-checker

缓存失效了?

删除缓存文件,手动修复错误后重启 Vite 即可。

插件运行非常慢?

默认地,插件是同步运行的,这可能会造成阻塞。请尝试启用 lintInWorker 选项,它保持了 Vite 的速度,并在控制台中打印信息。你也可以尝试一下社区内的 @nabla/vite-plugin-eslintvite-plugin-checker,或者在 Vite 之外直接运行 ESLint。

推荐配置?

ts
import { defineConfig } from "vite";
import eslint from "vite-plugin-eslint2";

export default defineConfig({
  plugins: [eslint({
    lintInWorker: true,
    lintOnStart: true,
  })],
});

错误信息全红?

Vite 的错误遮罩层不支持显示 PluginContext.warn 信息和全色消息,还有一些限制(参见 #2076#6274#8327)。