CommonJS对应的ES2015写法是什么?

发布于 2022-09-02 23:53:01 字数 632 浏览 12 评论 0

使用CommonJS形式的话可以直接导出一个模块:

module.exports = {};

如果使用rollup的话等同于如下:

export default {};

它会转换为如下代码

'use strict';

var main = {};

module.exports = main;

但是babel会转化为:

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});

exports.default = {};

export default导出的对象变成了模块的一个default属性,而不是整个模块。
那么如果使用babel编译的话,要使得export default导出的是整个模块该怎么做?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

愁杀 2022-09-09 23:53:01

在 babel 5 时代, export default {}; 除了会被转译成 exports.default = {};,还会加一句 module.exports = exports.default,这样就是楼主想要的整个模块,但在 babel6 时代做了一个区分,后面这句不再添加。这是为什么呢?在我看来,主要是为了区分 commonJS 和 es6 的模块定义,也就是 commonJS的 requiremodule.exports 搭配使用,而 import 则是和 export 搭配使用,因为在 babel 中,虽然是输出到 exports.default上,但 import 也会对应的默认去拿 default 下的模块,相当于 require(xxx)['default']。如果楼主非想要回到 babel5 时候的表现的话,babel6 有一个 plugin 可以做到。https://www.npmjs.com/package/babel-plugin-add-module-exports

凯凯我们等你回来 2022-09-09 23:53:01

编译成什么不重要,重要的是,它们在各自的环境下都是可用的。这对你来说就足够了。

理论上,es6的模块是静态模块,和CommonJS的模块含义有很大不同,你给的代码大致都说得通。不必强求为什么两个库实现不一样(又不是一个人写的,目标也不同,干嘛非得一样),语法就是语法,至于解释权rollupbabel都有自己解释的权利(你管不着)。

如果想了解更多这两个模块规范的不同,看这里

那一片橙海, 2022-09-09 23:53:01

export default {
}

不知道是不是你想要的

感性 2022-09-09 23:53:01

你说的是实现细节。

在实际使用上,如果 rollup 和 bebel 遵从相同的规范,那么它们的效果也是一样的。

没有必要强求实现细节也一样吧(毫无意义)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文