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

您需要在HTML页面中包含SystemJS。要从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文件...

Answer 2

<强> 的index.html

请务必添加以下内容。

<script src="https://code.angularjs.org/2.0.0-beta.7/angular2-polyfills.js"></script>


<script src="https://code.angularjs.org/tools/system.js"></script>
// error reason can be missing of this reference.


<script src="https://code.angularjs.org/tools/typescript.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.7/Rx.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.7/angular2.min.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.7/http.min.js"></script>
<script src="https://code.angularjs.org/2.0.0-beta.7/router.dev.js"></script>

Answer 3

这是angular2js: Uncaught Reference Error: System is not defined

的副本

如果Angular2 Seed已经实现了injections并且需要libs loading机制，那么您应该使用这些方法。

如果您要从scratch创建应用，则可以根据需要添加libs。

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

3 个答案: