使用'jspm'设置AngularJS 2项目`_Angularjs_Jspm

使用'jspm'设置AngularJS 2项目`

angularjs

使用'jspm'设置AngularJS 2项目`,angularjs,jspm,Angularjs,Jspm,我正在尝试使用jspm设置AngularJS 2项目，首先我尝试按照angular.io上的说明进行设置，它工作得很好因此，我正在尝试设置另一个相同的项目，但使用jspm我在“zonesperequired”方面有错误，我曾尝试使用谷歌搜索，但迄今为止我没有发现任何问题，所以请指导我怎么做 angular.io版本 app/index.ts index.html app/index.ts index.html AngularJS 2 System.config({ transpiler:'t

我正在尝试使用

jspm

设置AngularJS 2项目，首先我尝试按照angular.io上的说明进行设置，它工作得很好

因此，我正在尝试设置另一个相同的项目，但使用

jspm

我在“zonesperequired”方面有错误，我曾尝试使用谷歌搜索，但迄今为止我没有发现任何问题，所以请指导我怎么做

angular.io版本 app/index.ts

index.html

app/index.ts

index.html


AngularJS 2
System.config({
transpiler:'typescript'，
typescriptOptions:{emitDecoratorMetadata:true}，
包：{app'：{defaultExtension:'ts'}
});
系统导入（“应用程序/索引”）；
AngularJS 2

加载。。。

请参见

下面的提示为我解决了这个问题：

将其添加到主类中（就在

import'zone.js'；

下）：

导入'zone.js/dist/long stack trace zone'
请参见
下面的提示为我解决了这个问题：
将其添加到主类中（就在import'zone.js'；
下）：
导入'zone.js/dist/long stack trace zone'
import { bootstrap }    from 'angular2/platform/browser';
import { AppComponent } from './components/App';

bootstrap(AppComponent);

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJS 2</title>
    <script src="https://code.angularjs.org/2.0.0-beta.11/angular2-polyfills.js"></script>
    <script src="https://code.angularjs.org/tools/system.js"></script>
    <script src="https://npmcdn.com/typescript@1.8.9/lib/typescript.js"></script>
    <script src="https://code.angularjs.org/2.0.0-beta.11/Rx.js"></script>
    <script src="https://code.angularjs.org/2.0.0-beta.11/angular2.js"></script>

    <script type="text/javascript">
        System.config({
            transpiler: 'typescript',
            typescriptOptions: { emitDecoratorMetadata: true },
            packages: { 'app': { defaultExtension: 'ts' } }
        });

        System.import('app/index');
    </script>
</head>
<body>
    <h3>AngularJS 2</h3>
    <hr>
    <test-app>Loading ...</test-app>
</body>
</html>

jspm install angular2 reflect-metada zone.js

import 'zone.js';
import 'reflect-metadata';

import { bootstrap }    from 'angular2/platform/browser';
import { AppComponent } from './components/App';

bootstrap(AppComponent);

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>AngularJS 2</title>

    <script type="text/javascript" src="jspm_packages/system.js"></script>
    <script type="text/javascript" src="config.js"></script>

    <script type="text/javascript">
        System.config({
            transpiler: 'typescript',
            typescriptOptions: { emitDecoratorMetadata: true },
            packages: { 'app': { defaultExtension: 'ts' } }
        });

        System.import('app/index');
    </script>
</head>
<body>
    <h3>AngularJS 2</h3>
    <hr>
    <test-app>Loading ...</test-app>
</body>
</html>