将ES6与Angular2 rc3一起使用时,需要使用未捕获的反射元数据填充程序

时间:2016-06-27 12:32:05

标签: javascript angular ecmascript-6 systemjs

我刚刚将Angular从rc-1更新为最新rc-3。 该应用使用JavaScript ES6 和SystemJS。当我使用browsersync运行应用程序时,它可以工作。但是,如果我捆绑应用程序(使用systemjs-builder)然后运行它,我在浏览器控制台中出现此错误

  

使用类装饰器时需要使用未反映的元数据填充程序。

问题来自使用@angular/http基本http调用的组件,如果我删除了它import {Http, HTTP_PROVIDERS} from '@angular/http' ;

另外,TypeScript不会发生这种情况,但JS ES5和ES6也不会发生这种情况。 Webpack也不会发生这种情况。

我查看了捆绑的代码,看来SystemJS在Angular代码之前经过了Reflect代码...只有es6

index.js

import 'reflect-metadata';
import 'es6-shim';
import 'zone.js';
import {bootstrap} from '@angular/platform-browser-dynamic';
import {App} from './app.js';
bootstrap(App);

app.js

import {Component} from '@angular/core';
import {Http, HTTP_PROVIDERS} from '@angular/http';
@Component({
  selector: 'App',
  template: '',
  providers: [HTTP_PROVIDERS]
})
export class App {
  constructor(http) {}

  static get parameters() {
    return [[Http]];  
  }
}

1 个答案:

答案 0 :(得分:19)

reflect-metadataes6-shimzone.js应该是全局库。因此,您不应像在index.js中那样将它们导入到其中一个模块中。

尝试删除index.js中的import语句,并在index.html中引用它们,就像Angular 2 Quickstart中所述:

<script src="node_modules/zone.js/dist/zone.js"></script>
<script src="node_modules/reflect-metadata/Reflect.js"></script>
<script src="node_modules/systemjs/dist/system.src.js"></script>