使用@web/test-runner测试TS库时core-js报module is not defined错误

报错来自core-js内部使用了CommonJS规范的module全局变量，而@web/test-runner直接在浏览器环境运行代码，浏览器原生没有module全局对象，也不会默认转换CommonJS模块的语法。
触发场景是你Babel配置开启了useBuiltIns: 'usage'，会自动在打包产物中注入core-js的引用，测试阶段加载core-js这类CommonJS格式的依赖时就会触发报错。

下面提供两种可落地的修复方案，按需选择即可：

方案1：优化打包逻辑，避免ESM产物引入core-js #

你打包输出的index.es.js是ESM格式，通常供下游有打包工具的项目使用，不需要内置core-js polyfill，只有UMD格式的产物才需要内置polyfill供浏览器直接引用。调整Rollup配置即可：

// 保留原有导入不变
export default [
  // UMD 产物配置，保留babel和polyfill注入
  {
    input: 'src/index.ts',
    output: { file: pkg.main, name: libraryName, format: 'umd', sourcemap: true },
    plugins: [
      json(),
      nodePolyfills(),
      typescript(),
      commonjs(),
      nodeResolve({ browser: true, preferBuiltins: false }),
      sourceMaps(),
      babel({ babelHelpers: 'bundled', exclude: [/\bcore-js\b/, /\bwebpack\/buildin\b/] }),
    ],
  },
  // ESM 产物配置，移除babel的polyfill注入逻辑
  {
    input: 'src/index.ts',
    output: { file: pkg.module, format: 'es', sourcemap: true },
    plugins: [
      json(),
      typescript(),
      commonjs(),
      nodeResolve({ browser: true, preferBuiltins: false }),
      sourceMaps(),
    ],
  }
]

调整后重新打包，index.es.js就不会包含core-js的引用，测试时自然不会触发报错。

方案2：给测试工具添加CommonJS转换能力 #

如果你需要测试带polyfill的完整产物，就给@web/test-runner增加CommonJS模块处理能力：

1. 先安装依赖：

npm i @web/dev-server-rollup @rollup/plugin-commonjs rollup-plugin-node-polyfills -D

2. 项目根目录新建web-test-runner.config.js配置文件：

import { rollupAdapter } from '@web/dev-server-rollup';
import commonjs from '@rollup/plugin-commonjs';
import nodePolyfills from 'rollup-plugin-node-polyfills';

export default {
  files: 'test/**/*.test.ts',
  nodeResolve: {
    browser: true,
    preferBuiltins: false,
  },
  plugins: [
    rollupAdapter(nodePolyfills()),
    rollupAdapter(commonjs({
      include: ['node_modules/core-js/**/*']
    })),
  ],
};

3. 后续运行测试直接执行web-test-runner即可，不需要加额外参数。

内容的提问来源于stack exchange，提问作者R.Kalbe