带有TypeScript的角度:ReferenceError:未定义系统System.config [英] Angular with TypeScript: ReferenceError: System is not defined System.config

问题描述

我尝试根据此教程为TypeScript安装Angular 2: https://angular.io/guide/快速入门

I tried to install Angular 2 for TypeScript according to this tutorial: https://angular.io/guide/quickstart

我收到此错误:

ReferenceError:未定义系统System.config

ReferenceError: System is not defined System.config

我不知道这是怎么发生的.

I don't know how this happens.

文件夹结构:

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

推荐答案

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

You need to have SystemJS included into your HTML page. To make work your Angular2 application from your node_modules folder, you need at least:

<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).像这样的东西:

And configure SystemJS to load your compiled TypeScript (actually JavaScript one with a js extension). Something like that:

<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文件.

This configuration means that when you try to import some modules starting with app/, SystemJS will load corresponding JS file (compiled from TypeScript one). For example: System.import('app/main'); will load the app/main.js file.

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

This means that you need to have compiled your TypeScript files before. When launching the npm run start command, the tsc compiler is automatically started in background and will compile TypeScript files into JS ones when changes will be detected. You can check that the compiler is actually started and you have the JS files created...

这篇关于带有TypeScript的角度:ReferenceError:未定义系统System.config的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！