ES2015 中的条件导出

Question

假设您正在开发一个 polyfill，并且如果浏览器中已经存在一个类，则不想填充它。这在 ES6 中如何实现？以下无效，因为 exports 不是声明：

 if (typeof Foo === 'undefined') {
  export class Foo { ... }
}

如果上述条件评估为 false ，则导入脚本应该内置浏览器。

原文由 Dan Dascalescu 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

export 应该是静态的。对于条件导出 CommonJS 模块和 exports 可以使用。

它应该以这种方式使用 ES6 模块处理：

 export let Foo;

if (window.Foo === undefined) {
  Foo = class Foo { ... }
} else {
  Foo = window.Foo;
}

对于独立于平台的解决方案（ this 在转译代码中可能不等于全局） window 可以替换为

const root = (() => eval)()('this');
if (root.Foo === undefined) {
...

这利用了以这种方式设计的 ES6 模块的绑定功能 来处理循环依赖性，并 在此处 进行了详细解释。

上面的代码 转换为

...
var Foo = exports.Foo = void 0;

if (window.Foo === undefined) {
  exports.Foo = Foo = function Foo() {
    _classCallCheck(this, Foo);
  };
} else {
  exports.Foo = Foo = window.Foo;
}

在这种情况下，导出不是有条件的，但是 Foo 绑定到该导出的值是有条件的。

原文由 Estus Flask 发布，翻译遵循 CC BY-SA 3.0 许可协议

Answer 2

export 语法必须在模块的顶级范围内，因为您要声明存在哪些导出。您可以自由地有条件地为它们分配一个值，例如

export let Foo = global.Foo;

if (typeof Foo === 'undefined'){
    Foo = class { ... }
}

原文由 loganfsmyth 发布，翻译遵循 CC BY-SA 3.0 许可协议