如何配置vite build在构建前自动执行vitest单元测试？

Vite本身的build配置里确实没有直接提供前置执行测试的选项，但可以通过以下几种方式实现：

1. 修改package.json的scripts命令 #

最简单的方式是直接在构建命令前拼接测试命令，利用shell的顺序执行逻辑（只有测试成功才会继续后续步骤）：

{
  "scripts": {
    "test": "vitest run", // 以无头模式执行所有单元测试，适合生产构建/CI环境
    "build": "npm run test && vite build"
  }
}

执行npm run build时，会先运行vitest run，所有测试通过后才会启动vite build。

2. 自定义Vite插件实现钩子触发 #

如果需要更灵活的控制（比如根据环境决定是否执行测试），可以编写简单的Vite插件，利用buildStart钩子在构建启动前执行测试：

// vite.config.js
import { defineConfig } from 'vite';
import { execSync } from 'child_process';

export default defineConfig({
  plugins: [
    {
      name: 'pre-build-test',
      buildStart() {
        // 同步执行测试命令，输出直接继承当前终端，测试失败则终止构建
        execSync('vitest run', { stdio: 'inherit' });
      }
    }
  ]
});

这种方式会在每次执行vite build时自动触发测试流程，测试不通过则构建直接终止。

注意事项 #

• 确保vitest run命令能正确执行所有测试，且测试失败时返回非零退出码，这样shell或Node的execSync才能捕获失败并终止后续流程。
• CI环境中更推荐第一种scripts拼接的方式，逻辑直观且便于维护。

内容的提问来源于stack exchange，提问作者Eria