在Magento2中加载已编译的Typescript AMD模块

我试图将Magento 2变成未来，并在那里添加Typescript支持。一切编译正确，但我不能加载它:(在Magento2中加载已编译的Typescript AMD模块

要求-config.js

var config = { 
    deps: [ 
     "web/js/app" 
    ], 
    bundles: { 
     "web/js/app": [ "main", "moduleone", "moduletwo" ] 
    } 
};

网/ JS/app.js

define("moduleone", ["require", "exports"], function (require, exports) { 
    "use strict"; 
    Object.defineProperty(exports, "__esModule", { value: true }); 
    var ModuleOne = (function() { 
     function ModuleOne() { 
     } 
     ModuleOne.prototype.sayHello = function() { 
      console.log("Hello from ModuleTwo!"); 
     }; 
     ModuleOne.prototype.sayHelloTo = function (who) { 
      console.log("Hello " + who.trim() + ". This is ModuleTwo"); 
     }; 
     return ModuleOne; 
    }()); 
    exports.ModuleOne = ModuleOne; 
}); 
define("moduletwo", ["require", "exports"], function (require, exports) { 
    "use strict"; 
    Object.defineProperty(exports, "__esModule", { value: true }); 
    var ModuleTwo = (function() { 
     function ModuleTwo() { 
     } 
     ModuleTwo.prototype.sayHello = function() { 
      console.log("Hello from ModuleTwo!"); 
     }; 
     ModuleTwo.prototype.sayHelloTo = function (who) { 
      console.log("Hello " + who.trim() + ". This is ModuleTwo"); 
     }; 
     return ModuleTwo; 
    }()); 
    exports.ModuleTwo = ModuleTwo; 
}); 
define("main", ["require", "exports", "moduleone", "moduletwo"], function (require, exports, Module1, Module2) { 
    "use strict"; 
    Object.defineProperty(exports, "__esModule", { value: true }); 
    var Main = (function() { 
     function Main() { 
      console.log('Test'); 
     } 
     Main.prototype.start = function() { 
      var m1 = new Module1.ModuleOne(); 
      var m2 = new Module2.ModuleTwo(); 
      m1.sayHelloTo("David Wesst"); 
      m2.sayHelloTo("David Wesst"); 
     }; 
     return Main; 
    }()); 
    exports.Main = Main; 
});

加载模块：

<script type="text/javascript"> 
require(['main'], function(Main) { 
    console.log(Main); 
    var app = new Main(); 
    app.start(); 
});</script>

调用主要收益：

Uncaught TypeError: Main is not a constructor

Plz help！

来源

2017-02-27 Wewow

既然你正在写原AMD的JavaScript，只要使用return Main和不exports.Main = Main，是应该做的伎俩。

也许我是误解，那是编译输出，看起来确实如此。

在这种情况下使用，如果是从打字稿源代码编译，你可以（非常非常不愉快）使用

export = class Main {};

超过你所拥有的，现在这将是

export class Main {}

就个人而言，我会咬紧牙关，然后写

export default class Main {};

和引导与

<script type="text/javascript"> 
require(['main'], function(module) { 
    var Main = module.default; 
    console.log(Main); 
    var app = new Main(); 
    app.start(); 
});</script>

通过这种方式，我们可以一起向前移动并杀死浏览器中TypeScript + NodeJS + CJS + AMD + Interop的不良遗产部门。

来源

2017-02-27 10:02:09

在Magento2中加载已编译的Typescript AMD模块

回答

相关问题