Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Unhandled Promise rejection: Rx_1.Subject is not a constructor ; Zone: ; Task: Promise.then ; Value: TypeError: Rx_1.Subject is not a constructor

I have an Angular 2 app, that uses systemjs to map/load.

Importing the rxjs in the project, and referencing it is fine, but when the code is deployed, it fails to construct a Subject variable with 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 (when none are specified) 

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>(); // exteption HERE
    let m = b.asObservable(); 
    b.next("k");

all of rxjs is loaded fine in the browser.


UPDATE: Looking at this more, if I import Rx in my Angular service as:

import * as Rx from 'rxjs/Rx';

and than inspect the Rx object in the console, it just has a default, and __useDefault property getter. Everything else, Observable, Subject is accessible through them.

Like doing :

var observable = Rx.Observable.create(function (observer) {
        observer.next(1);
    });

gets back an:

VM1083:1 Uncaught TypeError: Cannot read property 'create' of undefined

whereas, of course:

var observable = Rx.default.Observable.create(function (observer) {
        observer.next(1);
    });

works fine.

My project is in Typescript, I have tried target compilation es5 and es6.

like image 298
amy8374 Avatar asked Oct 13 '17 22:10

amy8374


1 Answers

I was earlier importing 'import { Subject } from 'rxjs/Subject''. Changed to 'import { Subject } from 'rxjs''. This resolved the issue for me.

like image 82
Jatin Gupta Avatar answered Sep 29 '22 01:09

Jatin Gupta