Bắt buộc phản ánh siêu dữ liệu siêu dữ liệu khi sử dụng ES6 với Angular2 rc3

Question

Tôi vừa cập nhật Góc từ rc-1 lên mới nhất rc-3. Ứng dụng đang sử dụng JavaScript ES6 và SystemJS. Khi tôi chạy ứng dụng với browserync, nó hoạt động. Nhưng nếu tôi bó ứng dụng (với systemjs-builder) và sau đó chạy nó, tôi có lỗi này trong trình duyệt console

Uncaught reflect-metadata shim is required when using class decorators.

vấn đề này xuất phát từ một thành phần sử dụng @angular/http với một cuộc gọi http cơ bản, nếu tôi loại bỏ import {Http, HTTP_PROVIDERS} from '@angular/http' ; nó hoạt động.

Ngoài ra, nó không xảy ra với TypeScript nhưng nó có với JS ES5 và ES6. Ngoài ra nó không xảy ra với Webpack.

Tôi nhìn vào mã kèm và dường như SystemJS đi qua Angular mã trước khi Reflect mã ... chỉ với 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]]; 
    } 
} 

Answer 1

reflect-metadata, es6-shim và zone.js được coi là thư viện toàn cầu. Do đó, bạn không nên nhập chúng vào một trong các mô đun của bạn như bạn làm trong index.js.

Cố gắng loại bỏ những điều khoản về nhập khẩu index.js của bạn và tham khảo chúng trong index.html của bạn như nó được giải thích trong 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>