Angular2 的简单 运行 使用 es6-promise .Promise 抛出错误

Simple run of Angular2 throws an error with es6-promise .Promise

我正在尝试 运行 Angular 2 Alpha 45 ('https://code.angularjs.org/2.0.0-alpha.45/angular2.dev.js') 但它在 "es6Promise._setAsap" 处失败,说 es6Promise 未定义。

var es6Promise = require('es6-promise').Promise;

// es6-promise asap should schedule microtasks via zone.scheduleMicrotask so that any
// user defined hooks are triggered
es6Promise._setAsap(function(fn, arg) {
  global.zone.scheduleMicrotask(function() {
    fn(arg);
  });
});

当前页面是:

<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <script src="javascripts/system.js"></script>
        <script>
          System.config({
            map: {
                'es6-shim':'javascripts/es6-shim.js',
                'angular2/angular2': 'javascripts/lib/angular2.alpha.45.dev.js'
            }
          });
            System.import('es6-shim').then(function(){
                System.import('javascripts/app.js');
            });

        </script>            
    </head>    
    <body>
        <my-app>Loading...</my-app>
    </body>
</html>

app.js 包含示例文件的转换,其中包含:

import {Component, bootstrap} from 'angular2/angular2';
@Component({
    selector: 'my-app',
    template: '<h1>My First Angular 2 App b</h1>'
})
class AppComponent { }
bootstrap(AppComponent);

问题是: 为什么 require('es-promise') returns 是一个空对象? 我正在使用 app.js 的简单打字稿导出,除了 angular.io 谈论的 systemjs 之外别无其他。

我想我遗漏了一些东西,也许是 ES6 垫片或浏览器的另一个版本的 angular2?

又搜索了一个小时,显然 - 我不知道为什么 Angular 的当前文档中没有明确说明 - SystemJs 配置存在问题:

它遗漏了 angular2 在其脚本中使用特定格式的事实,您必须明确设置它。

HTML 代码中的最终脚本如下所示:

<script src="javascripts/system-polyfills.js"></script>
<script src="javascripts/system.js"></script>
<script>
    System.config({
        paths:{"*":"../*.js"},
        map: {
            'angular2/angular2': 'javascripts/lib/angular2.dev',
            'crypto':'javascripts/crypto'
        },
        meta: {
            'angular2/angular2':{
                format: 'register'
            }
        }
    });
    System.import('javascripts/app');
</script>    

附加信息:

  • 我认为来自 angular.io 的信息是针对旧版本的 SystemJs(可能是 16,因为它与我在这里使用的 19 确实不同),我认为 CommonJS 在内部使用 Angular,但 SystemJs 警告我它在代码中发现了类似 "System.register" 的东西,所以我将格式更改为 "register"(兼容模块格式)。
  • 如果你想让它在旧浏览器上工作,请不要忘记添加 system-pollyfill