Angular2 + webpack Uncaught ReferenceError：未定义系统

Question

我有同样的问题： 为什么webpack捆绑为'System.register'

我用webpack构建了bundle.js，我收到了错误：

未捕获的ReferenceError：未定义系统

我的bundle.js包括：

   System.register(['angular2/platform/browser', './app.component', 'rxjs/Rx'], function(exports_1, context_1) {
        "use strict";
        var __moduleName = context_1 && context_1.id;
        var browser_1, app_component_1;
        return {
            setters:[
                function (browser_1_1) {
                    browser_1 = browser_1_1;
                },
                function (app_component_1_1) {
                    app_component_1 = app_component_1_1;
                },
                function (_1) {}],
            execute: function() {
                //enableProdMode();
                browser_1.bootstrap(app_component_1.AppComponent)
                    .then(function (success) { return console.log("Bootstrap success"); })
                    .catch(function (error) { return console.log(error); });
            }
        }
    });

我已经在tsconfig.json中将模块更改为commonjs，所以在某处可能有些愚蠢的错误。 这是我的tsconfig.json

{
  "compilerOptions": {
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "module": "commonjs",
    "removeComments": true,
    "sourceMap": false
  },
  "exclude": [
      "node_modules"
  ]
}

和webpack.config.js

module.exports = {
  entry: "./app/main",
  output: {
    filename: "bundle.js"
  },
  resolve: {
    extensions: ['', '.js', '.ts']
  },
  module: {
    loaders: [{
      test: /\.ts/, loaders: ['ts-loader'], exclude: /node_modules/
    }]
  }
};

谢谢你的帮助

Answer 1

将module更改为commonjs的compilerOptions中的commonjs。

Answer 2

当使用带有Typescript项目的webpack时，如果使用commonjs作为模块，则不应将.ts文件转换为.js文件。