为什么会有这个 __esModule: true
When I use export default myFunc, resulting output is not directly callable!
Instead it's an object {__esModule: true, default: myFunc}
This is not a bug, and it's not related to umd-wrapper-plugin.
This is how esbuild transpiles export default to CJS.
As a workaround use exports = myFunc.
Instead it's an object {__esModule: true, default: myFunc}
This is not a bug, and it's not related to umd-wrapper-plugin.
This is how esbuild transpiles export default to CJS.
As a workaround use exports = myFunc.
这是因为你在使用 export default
导出模块时,默认导出的方式会根据模块系统和导入方式的不同而有所变化。
在使用 CommonJS 或者 Node.js 的 require 导入模块时,export default
导出的模块会被包装在一个对象中。这个对象会有一个特殊的属性 default
,它的值是你导出的具体函数或对象,而 __esModule
是一个标志属性,用来表示这个模块是一个 ES 模块。
这种包装是为了与 CommonJS 模块系统的导入方式保持兼容性,因为 CommonJS 模块系统没有支持默认导出的语法。所以,导出模块时需要将默认导出的函数或对象作为 default
属性的值。
例如,当你在一个文件中这样导出一个函数:
function myFunc() {
// ...
}
export default myFunc;
当你在其他文件中使用 CommonJS 的 require 导入这个模块时:
const myFunc = require('./myModule'); // 导出的模块会被包装在一个对象中
myFunc(); // 正确调用方式
你需要通过访问 default
属性来访问导出的函数或对象:
myFunc.default(); // 通过 `default` 属性来调用导出的函数
如果你在使用 ES 模块导入时,可以直接获取到默认导出的值:
import myFunc from './myModule'; // 直接获取默认导出的值
myFunc(); // 正确调用方式
总结来说,这种包装的方式是为了与不同的模块系统保持兼容,确保你能够正常地导入和使用默认导出的函数或对象。