CODEWITHSUNDEEP
javascriptsystemjsjspm
dustins
dustins

Reputation: 353

SystemJS doesn't load RxJS properly

I'm having trouble getting RxJS to load properly using SystemJS (0.19.47)

Basically I have some TypeScript…

import {BehaviorSubject} from  "rxjs";

let subject = new BehaviorSubject(4);

That is transpired to JavaScript…

System.register(["rxjs"], function (exports_1, context_1) {
    "use strict";
    var __moduleName = context_1 && context_1.id;
    var rxjs_1, subject;
    return {
        setters: [
            function (rxjs_1_1) {
                rxjs_1 = rxjs_1_1;
            }
        ],
        execute: function () {
            subject = new rxjs_1.BehaviorSubject(4);
        }
    };
});

However when it runs, rxjs_1_1 comes in looking something like the following, so when it tries to instantiate, rxjs_1.BehaviorSubject it is undefined, because it really should be calling rxjs_1.default.BehaviorSubject.

{
  "default": {
    "BehaviorSubject": function (_value) {…}
  }
}

All the other things I am loading with SystemJS seem to work fine, and because I can see BehaviorSubject under the "default" key, I know it is actually loading. I just don't understand why RxJS isn't working.

Upvotes: 1

Views: 949

Answers (6)

thatseeyou
thatseeyou

Reputation: 2012

Try my settings:

tsconfig.json

"compilerOptions": {
    "module": "commonjs",
    ...
}

"module": "system" is not working well in my experience.

ts

import { BehaviorSubject } from 'rxjs/BehaviorSubject';

Upvotes: 0

Daniel Na
Daniel Na

Reputation: 19

I had the same issue.

The workaround was to change systemjs to one of the previous versions. In my case 0.19.27 did work.

Upvotes: 1

Tomek Dudzik
Tomek Dudzik

Reputation: 1

I have the similar problem. The code below not working because Observable is undefined

import { Observable } from 'rxjs/Observable';
let obs = Observable.create((observer) => observer.next(1));

But when I change code in JS file like this

obs = Observable_1.default.Observable.create(...)

then all works correctly.

Upvotes: 0

martin
martin

Reputation: 96909

You're importing RxJS correctly. For example:

// import.ts
import {BehaviorSubject} from "rxjs";

let subject = new BehaviorSubject(4);
console.log(subject);

When compiled to JS you can load it in node with (depending on your directory structure obviously):

const SystemJS = require('systemjs');

SystemJS.config({
  map: {
    'rxjs': './node_modules/rxjs/bundles/Rx.js',
  },
});

SystemJS.import('import_01.js');

So the question is why you think BehaviorSubject should be under some "default" property because RxJS package has no default export.

From the tags in your question it looks like you're using jspm but you didn't mention it in you post so the problem is probably there and not in SystemJS.

Upvotes: 0

Aravind
Aravind

Reputation: 41573

import {BehaviorSubject} from  "rxjs/BehaviorSubject";

or 

import { BehaviorSubject } from "RxJs";

Upvotes: 0

Downhillski
Downhillski

Reputation: 2655

try import {BehaviorSubject} from "rxjs/Rx";

Upvotes: 1

Related Questions