webpack打包后moduleexports不能抛出

你写了个 npm 包，包后本地测试好好的包后，module.exports = { foo } 跑得飞起。包后一上 webpack 打包，包后别人 require 进来直接傻眼——undefined。包后不是包后路径写错，也不是包后没 install，问题就出在 webpack 对 CommonJS 那套 module.exports 的包后处理逻辑上。

先看个真实案例。包后我手头有个工具库，包后入口文件长这样：

// index.js function foo() {  return 'foo'; } module.exports = {  foo }; 

用 webpack 配 output.libraryTarget: 'commonjs2' 打包，包后生成 bundle 后丢到 Node 里 require，包后拿到的包后对象是空的。Object.keys 出来一个键都没有。包后但把 module.exports 换成 exports.foo = foo，包后嘿，正常了。

原因不复杂。webpack 在打包时会把你的模块代码包进一个函数里，类似这样：

function(module, exports, __webpack_require__) {  function foo() {  return 'foo'; } module.exports = {  foo }; } 

看起来没问题对吧？但 webpack 自己维护了一套模块系统。它不直接执行你的 module.exports 赋值，而是通过 __webpack_require__ 来管理模块导出。当你写 module.exports = { foo } 时，webpack 的运行时可能把这个赋值给“吞”了，或者覆盖了它自己的导出引用。

具体点说，webpack 4 以后对 ESM 和 CJS 的混合处理很敏感。如果你的 package.json 里 "type": "module" 或者 .mjs 后缀，webpack 会按 ESM 解析，module.exports 直接被忽略。但更常见的是配置问题：output.library.type 设成了 'module' 或者 'var'，却指望 module.exports 能抛出来。那不可能。

我试过最直接的修复：把 output.libraryTarget 明确写成 'commonjs2'，同时确保 output.library 有名字。但还不够。webpack 会把你的 module.exports 包装成一个 __webpack_exports__ 对象。如果你在代码里直接覆盖 module.exports，webpack 的运行时可能拿不到这个新对象。

另一个坑是 externals。有时候你 externals 配了某个依赖，webpack 就不打包它，但你的 module.exports 里引用了那个依赖，结果导出对象里那个属性变成 undefined。这不算 module.exports 本身没抛出，但现象一样：别人 require 进来发现东西不全。

怎么判断是不是 webpack 的锅？简单。用 webpack --mode development 打包，别压缩，打开生成的 bundle，搜 module.exports。如果发现它被替换成了 __webpack_require__.d(__webpack_exports__, ...) 之类的，那就实锤了。webpack 在转换你的 CJS 代码时，把 module.exports = ... 重写成了对 __webpack_exports__ 的赋值。但如果你在代码里又手动 module.exports = something，它就跟 webpack 自己的导出系统打架。

最稳的写法？别用 module.exports = 整体覆盖。改成 exports.foo = foo 或者 module.exports.foo = foo。这样 webpack 能正确追踪每个属性的导出。或者，如果你非要整体覆盖，用 output.libraryTarget: 'umd' 并配合 output.globalObject: 'this'，但 UMD 在 Node 里又可能因为 this 指向问题翻车。

我自己的习惯：如果这个包只给 Node 用，直接上 tsc 或者 esbuild，别碰 webpack。webpack 适合打包浏览器端资源，拿它打包纯 Node 库，module.exports 的抛出行为就是开盲盒。你永远不知道它会在哪一层把导出吃掉。

还有个细节：optimization.concatenateModules 开启时，webpack 会做作用域提升，多个模块合并成一个。这时候 module.exports 的赋值可能被提升到外层，导致导出对象引用错乱。关掉这个选项，问题有时就消失了。但关掉它打包体积会变大，自己权衡。

总之，webpack 打包后 module.exports 不能抛出，不是 bug，是 webpack 模块系统和你手写 CJS 之间的语义冲突。要么改写法，要么换工具。别跟它硬刚。

很赞哦!（8984）