jest中moduleNameMapper映射的mock文件内Proxy getter的console.log不打印原因

云上老周

2026-10-4

问题原因

你导入CSS文件的方式是仅执行模块副作用的无引用导入，没有任何代码访问styleMock导出的Proxy对象的属性，get 捕获器从未被触发，因此内部的console.log不会打印。

详细说明

你的index.js中使用的是 import './index.css' 语法，这属于仅执行模块顶层代码的副作用导入：JS引擎只会执行styleMock.js的顶层代码（也就是你写的第一行console.log('style mock')会被执行），但不会读取、使用该模块导出的任何值。
你导出的Proxy对象的get捕获器，只有在读取该对象的属性时才会触发。当前你的代码中没有任何地方访问这个Proxy的属性，自然不会执行get方法内的逻辑。

验证方法

你可以修改index.js的代码，主动访问导出的样式属性，就能看到get捕获器的日志：

// 修改index.js代码
import styles from './index.css';

console.log(styles['my-component']); // 主动访问Proxy属性，触发get捕获器

export function MyComponent() {
  return null;
}

重新运行jest后就能看到key: my-component的打印日志。