使用TypeScript的Angular:ReferenceError:系统未定义System.config

Question

我根据本教程尝试为TypeScript安装Angular 2:https://angular.io/guide/quickstart

我收到这个错误:

ReferenceError:系统未定义System.config

我不知道这是怎么回事.

文件夹结构:

project
|-index.hml
|-assets
    |-js
    |- jquery
    |-app
       |-app.component.js
       |-app.component.ts
       |-app.component.js.map
       |-main.js
       |-main.ts
       |-main.js.map

Answer 1

您需要将 SystemJS 包含到您的 HTML 页面中。要使您的node_modules文件夹中的 Angular2 应用程序正常工作，您至少需要：

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script> <!---
<script src="node_modules/rxjs/bundles/Rx.js"></script>
<script src="node_modules/angular2/bundles/angular2.dev.js"></script>

并配置 SystemJS 来加载已编译的 TypeScript（实际上是带js扩展名的 JavaScript）。像这样的东西：

<script>
  System.config({
    map: {
      app: 'assets/js/app'
    },
    packages: {        
      app: {
        format: 'register',
        defaultExtension: 'js'
      }
    }
  });
</script>

这个配置意味着当你尝试导入一些以 开头的模块时app/，SystemJS 将加载相应的 JS 文件（从 TypeScript 编译而来）。例如：System.import('app/main');将加载app/main.js文件。

这意味着您需要之前编译过 TypeScript 文件。启动npm run start命令时，tsc 编译器会在后台自动启动，并在检测到更改时将 TypeScript 文件编译为 JS 文件。您可以检查编译器是否实际启动并且您已创建 JS 文件...