javascript - Babel 6 更改了默认导出方式

标签 javascript ecmascript-6 babeljs commonjs

之前,babel 会添加行 module.exports =exports["default"]。它不再这样做了。这意味着在我能做之前:

var foo = require('./foo');
// use foo

现在我必须这样做:

var foo = require('./foo').default;
// use foo

没什么大不了的(我猜这本来就是应该的)。 问题是我有很多代码取决于过去的工作方式(我可以将其中大部分转换为 ES6 导入,但不是全部)。任何人都可以给我一些关于如何使旧方式工作的提示,而不必通过我的项目并修复这个问题(或者甚至一些关于如何编写代码模块来执行此操作的说明将非常流畅)。

谢谢!

示例:

输入:

const foo = {}
export default foo

Babel 5 的输出

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
var foo = {};
exports["default"] = foo;
module.exports = exports["default"];

使用 Babel 6(和 es2015 插件)的输出:

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
var foo = {};
exports["default"] = foo;

请注意,输出中的唯一区别是 module.exports = Exports["default"]

<小时/>

编辑

您可能对我在解决具体问题后撰写的这篇博文感兴趣:Misunderstanding ES6 Modules, Upgrading Babel, Tears, and a Solution

最佳答案

如果您想要 CommonJS 导出行为,则需要直接使用 CommonJS(或使用其他答案中的插件)。此行为已被删除,因为它会引起困惑并导致无效的 ES6 语义,而某些人曾经依赖过这些语义,例如

export default {
  a: 'foo'
};

然后

import {a} from './foo';

这是无效的 ES6,但由于您所描述的 CommonJS 互操作性行为而有效。不幸的是,支持这两种情况是不可能的,并且允许人们编写无效的 ES6 比让您编写 .default 更糟糕。

另一个问题是,例如,如果用户将来添加命名导出,他们会感到意外

export default 4;

然后

require('./mod');
// 4

但是

export default 4;
export var foo = 5;

然后

require('./mod')
// {'default': 4, foo: 5}

关于javascript - Babel 6 更改了默认导出方式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33505992/

相关文章:

javascript - Nivo 响应线图仅响应于变宽,而不是变窄

javascript - 如果文档 URL indexOf

javascript - 使用filter()返回对象数组的唯一元素

javascript - 如何从 CLI 执行 es6 脚本

javascript - webpack-dev-server 热重载无法运行的可能原因是什么?

javascript - 如何在javascript中将变量传递给href?

JavaScript - 用数组助手替换 for 循环

reactjs - react native 转换 - 错误找不到预设“babel-preset-react-native-stage-0

javascript - 如何使用 Babel 作为 CLI 程序?

javascript - 如何用cdn加载html中的es6、react、babel代码?