Angular2 + webpack未捕获ReferenceError:系统未定义 [英] Angular2 + webpack Uncaught ReferenceError: System is not defined

问题描述

我遇到了同样的问题: 为什么将webpack捆绑为"System.register"

I've got the same issue like here: Why webpack bundled as 'System.register'

我已经使用webpack构建bundle.js，但出现错误:

I've build bundle.js with webpack and I am getting error:

未捕获的ReferenceError:系统未定义

Uncaught ReferenceError: System is not defined

我的bundle.js包括:

my bundle.js inlcudes:

   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

I've already changed module to commonjs in tsconfig.json, so it's probably some silly mistake somewhere. Here is my tsconfig.json

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

和webpack.config.js

and 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/
    }]
  }
};

感谢您的帮助

推荐答案

将tsconfig.json的compilerOptions中的module更改为commonjs.

Change module to commonjs in compilerOptions of your tsconfig.json.

这篇关于Angular2 + webpack未捕获ReferenceError:系统未定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！