将Babel外部帮助程序与ES6模块一起使用时遇到麻烦-Babel重新排序导入/导出会中断执行顺序

Question

我在尝试将Babel的外部帮助程序与ES6模块一起使用时遇到问题，并且想知道我是否正在以正确的方式进行操作。 到目前为止，我无法运行已转码的代码，如下所述，但是tl; dr版本是Babel正在重新排序我的import和export到破坏代码的顺序，而我没有知道为什么要这么做。

这是一个非常简单的示例，演示了此问题：

源极/ index.js

// import babel helpers first so they are added to the global scope 
// and available to anything that needs them
import './babel-helpers';

export * from './dependency';

源极/ dependency.js

const constant = 'myProp';

const a = { [constant]: 1 };
const b = { [constant]: 2 };

export { a, b };

source / babel-helpers.js （使用babel-external-helpers -l defineProperty自动生成）

(function (global) {
  var babelHelpers = global.babelHelpers = {};

  babelHelpers.defineProperty = function (obj, key, value) {
    if (key in obj) {
      Object.defineProperty(obj, key, {
        value: value,
        enumerable: true,
        configurable: true,
        writable: true
      });
    } else {
      obj[key] = value;
    }

    return obj;
  };
})(typeof global === "undefined" ? self : global);

.babelrc

{
  "plugins": ["external-helpers"],
  "presets": ["env"]
}

---

使用babel source --output-dir built build编译这些文件后，输出为：

内置/ index.js

'use strict';

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

var _dependency = require('./dependency');

Object.keys(_dependency).forEach(function (key) {
  if (key === "default" || key === "__esModule") return;
  Object.defineProperty(exports, key, {
    enumerable: true,
    get: function get() {
      return _dependency[key];
    }
  });
});

require('./babel-helpers');

内置/ dependency.js

'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});
var constant = 'myProp';

var a = babelHelpers.defineProperty({}, constant, 1);
var b = babelHelpers.defineProperty({}, constant, 2);

exports.a = a;
exports.b = b;

Built / babel-helpers.js与原始版本没有明显变化

---

我遇到的问题是由于某种原因，已转译的import './babel-helpers'被移到index.js的末尾 ，因此当我尝试运行代码时，它很容易失败并出现错误，因为使用帮助程序的代码会在将其添加到全局范围之前运行：

var a = babelHelpers.defineProperty({}, constant, 1);
        ^

ReferenceError: babelHelpers is not defined

如果我手动编辑转译的index.js以移动require('./babel-helpers'); 到文件顶部，代码运行正常。

所以我有两个问题：

1. Babel为什么对import和export进行这种奇怪的重新排序？ 看来完全是荒谬的。 有没有办法控制它？
2. 我会以错误的方式处理吗？ 有没有使用外部帮助程序的更好方法？ 该文件没有给出什么实际与生成的助手做指导。 将它们生成到模块中并将该模块显式导入到最终需要它们的每个文件中可能会起作用，但这似乎是解决问题的一种非常详尽的方法。 当然，最好不要在预编译的源代码中显式引用我的各个模块。

我创建了这种情况的Github存储库，以防万一有人想自己运行它： https : //github.com/JLRishe/babel-helpers-e6-modules-issue

Answer 1

事实证明，重新导入和重新排序是Babel 7.x Beta中修复的错误：

https://github.com/babel/babel/issues/6468

我结束了就此发表自己的问题，Babel团队成员回答指出这是一个已知（已修复）问题。 他还提供了一些有关使用外部帮助程序的建议，因为事实证明，在编写库时，将其全局导入并不是一个好主意：

https://github.com/babel/babel/issues/6919