对象在 babel 转换后不支持此操作 new x()

Question

我目前正在将一堆 JavaScript 模块转换为 ECMAScript 6 classes。我们正在为 AMD 加载程序使用 require.js 并手动编写 define([], ...) 逻辑。

我们正在使用 Babel 将 ES 6 classes 转译回 ES 5 定义的模块。我的 bablerc 文件如下所示：

{
"presets": ["es2015"],
"plugins": ["transform-es2015-modules-amd"]
}

一个简单的class看起来像这样

import x from "dev/x"
import ko from "knockout"
import z from "dev/z"

export class y extends x {
...
}

输出看起来基本正确：

define(["exports","dev/x", "knockout", "dev/z"], function(x, knockout, z){

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

// Bunch of generated crap
var y = exports.y = function(_x)...(_x2.default);
}

所以当我尝试这样做时：

var foo = new y();

我收到 "Object doesn't support this action" JavaScript 异常。

我试图将生成的代码（我不想这样做）更改为：

var y = exports = function(_x)...(_x2.default);

但这并没有起到任何作用。但是，当我将该行更改为：

return function(_x)...(_x2.default);

或添加此行：

var y = exports = function(_x)...(_x2.default);
return y;

一切正常。我不想每次我们进行更改时都必须修改生成的文件，我只希望 babel 做它的事情并且是正确的！我在这里错过了什么？

更新：我正在使用 Druandal 库 (durandaljs.com) 的 system.js 部分，它通过传递一个名为 aquire 模块 ID 的函数来包装对 require 的调用，并加载它。所以我这样打电话：

system.acquire(moduleNameAndPath).then(function acquiredModuleFunc(acquiredModule) {
    if (acquiredModule !== null || acquiredModule !== undefined){
        var item = new acquiredModule(); // Object doesn't support here...
    }
}

我们在构建视图绑定的视图模型时使用它来引入伪多态行为。

Answer 1

您正在导出名为 y 的构造函数。在您的导入 (acquire) 中，您似乎尝试在模块对象本身上使用 new。相反，尝试

system.acquire(moduleNameAndPath).then(function(acquiredModule) {
    var Y = acquiredModule.y;
    var item = new Y();
});

对象在 babel 转换后不支持此操作 new x()

object doesn't support this action new x() after babel transform

javascript

ecmascript-6

babeljs

amd

js-amd