My Angular 2 app uses systemjs for mapping/loading.
While importing rxjs in the project and referencing it works fine, deploying the code results in a failure to construct a Subject variable with the error message:
"Unhandled Promise rejection: Rx_1.Subject is not a constructor ; Zone: ; Task: Promise.then ; Value: TypeError: Rx_1.Subject is not a constructor".
Rx on systemjs:
(function (global) {
var map = {
'app': 'app',
'@angular': 'js/@angular',
// other libraries...
'rxjs': 'js/rxjs',
};
// packages tells the System loader which filename and/or extensions to look for by default
var packages = {
'app': { main: 'main.js', defaultExtension: 'js' },
'rxjs': { defaultExtension: 'js' }
};
The way I am instantiating the subject:
import { Injectable } from '@angular/core';
import { Subject } from "rxjs/Rx";
@Injectable()
export class MyService {
constructor(private http: Http) {
let b = new Subject<string>(); // exception HERE
let m = b.asObservable();
b.next("k");
All of rxjs is loaded fine in the browser.
UPDATE: Upon further investigation, if I import Rx in my Angular service as:
import * as Rx from 'rxjs/Rx';
and then inspect the Rx object in the console, it only has a default, and __useDefault property getter.
However, all other features like Observable and Subject are accessible through them.
For example:
var observable = Rx.Observable.create(function (observer) {
observer.next(1);
});
results in:
VM1083:1 Uncaught TypeError: Cannot read property 'create' of
undefined
whereas, using:
var observable = Rx.default.Observable.create(function (observer) {
observer.next(1);
});
everything works correctly.
My project is in TypeScript, and I have tried compiling targeting ES5 and ES6.