Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error looking for rxjs/operators.js #2971

Closed
bmkleine opened this issue Oct 18, 2017 · 55 comments · Fixed by Xenira/Shashki#66
Closed

Error looking for rxjs/operators.js #2971

bmkleine opened this issue Oct 18, 2017 · 55 comments · Fixed by Xenira/Shashki#66

Comments

@bmkleine
Copy link

**RxJS version: 5.5.0 **

Additional information:
It looks like there is still one place using the old operators file (src/observable/dom/AjaxObservable.ts) line 7: import { map } from '../../operators';

@nagarajpatil
Copy link

Is this issue fixed?

@gildebrand
Copy link

We ran into this issue as well, and pinned RxJS to version 5.4.3. This made it work for us again.

@Tovrik
Copy link

Tovrik commented Oct 18, 2017

Did the same as @gildebrand but hoping that is just a temporary change and they fix it in 5.5.1 real fast 😬

@apeman86
Copy link

We had to do the same as @gildebrand.

@kwonoj
Copy link
Member

kwonoj commented Oct 18, 2017

anyone mind sharing small repo to test out this failure? I'm trying to look into this now.

@jasonaden
Copy link
Collaborator

I would be willing to bet this is using SystemJS.

Internally we shouldn't be referring to rxjs/operators as it will work in development, but will fail with SystemJS.

@gildebrand
Copy link

@jasonaden that's correct that this occurs with SystemJS!

@kwonoj
Copy link
Member

kwonoj commented Oct 18, 2017

I have pushed fix, there'll be patch release once it's available.

@nagarajpatil
Copy link

nagarajpatil commented Oct 18, 2017 via email

@zrsio4
Copy link

zrsio4 commented Oct 18, 2017

I've also reverted back to 5.4.3 for now.
I had a similar but different error when I removed rxjs from SystemJS config and added ".../node_modules/rxjs/bundles/Rx.js" script tag to the page header.

@alan-agius4
Copy link
Contributor

Having the same problem as well.

@buu700
Copy link

buu700 commented Oct 19, 2017

I'm using webpack (Angular CLI), and all the operator functions are undefined at run-time for me with 5.5.0. Specifically, I'm getting an error when .first() is called on a BehaviorSubject.

Is this the same bug described here, or should I report it separately?

@jasonaden
Copy link
Collaborator

@buu700 I think this is a separate issue. If you could file an issue with a reproduction, that would be great.

@buu700
Copy link

buu700 commented Oct 19, 2017

Got it, thanks! Actually, upon further investigation, I'm not sure whether this is an rxjs or Angular bug, so I'll report the details in a ticket there and CC you.

Edit: Actually this is probably just a package version mismatch.

@shaycraft
Copy link

I had this problem too (fixed by reverting the version) and I am using SystemJS. Is only WebPack going to be supported in the future?

@jasonaden
Copy link
Collaborator

@shaycraft Nope. Just waiting for a 5.5.1 release. If you were on master SystemJS would be working right now.

@mlc-mlapis
Copy link

This the file operators.js (zipped) that is necessary to temporarily add to node_modules/rxjs directory for RxJS 5.5.0 to enable it for using with SystemJS:

operators.zip

@kylecordes
Copy link

kylecordes commented Oct 21, 2017

I maintain an automatic parallel package of RxJS, which produces a SystemJS bundle: https://www.npmjs.com/package/rxjs-system-bundle

... and of course I hit the same problem. I worked around it:

OasisDigital/rxjs-system-bundle@b0f714a#diff-0b83f9dedf40d7356e5ca147a077acb4R9

with a (hopefully very temporary) hack consisting of a single sed command:

sed -e "s/'\./'.\/operators/" <node_modules/rxjs/operators/index.js >node_modules/rxjs/operators.js

I don't recommend this, I just did it to keep producing a working bundle. Hopefully the need will evaporate with the upcoming 5.5.1.

@pe8ter
Copy link

pe8ter commented Oct 24, 2017

@kylecordes I'm still seeing this issue with my SystemJS bundle on 5.5.1.

EDIT: But I suspect that this is a problem with my systemjs-builder config and not rxjs.

@babeal
Copy link

babeal commented Oct 24, 2017

@pe8ter no i am seeing the same thing. They are requiring "operators" which is a folder which isn't allowed. Only webpack (or other bundler) allows import of folder where it assumes you mean the index inside of the folder. There is no way for system.js in the client to do this. This needs to be fixed as it is a breaking change.

@kylecordes
Copy link

@babeal What you're saying is true of the code as it is arrives from RxJS, but it is possible to work around it, and I have done so with an awful hack that I mentioned a few messages up. My hack creates the missing operators.ts file. It is ugly but it does work fine. When I get a chance I will post a Plunkr demonstrating it.

@mlc-mlapis
Copy link

@jasonaden ... did we understand wrongly that version 5.5.1 eliminates the problem with missing operators.js file (#2971 (comment))?

@babeal
Copy link

babeal commented Oct 24, 2017

@kylecordes yea thanks. I hear you it's easy to fix but I don't want to have to do that for the 15 projects I maintain so I will lock to 5.4.x until this is fixed.

@kylecordes
Copy link

@pe8ter @babeal @mlc-mlapis Here are the changes in RxJS between 5.5.0 and 5.5.1; I don't think any of these are relevant to our SystemJS operators.ts problem here unfortunately. So I think the @kwonoj fix must have been about a different 5.5.0 glitch.

9538a20...0650c52

Here is a plunkr which shows my SystemJS redistribution of RxJS in action (look at config.js). Take a look at app.ts to see the operator import.

https://plnkr.co/edit/4Y6KAJ28Wwua8RSVaV8A?p=preview

@schwede
Copy link

schwede commented Oct 24, 2017

It looks to me like the issue was introduced here: ba2f586#diff-5fe03a9b5bb68d1a34618cf458d64e1c

Is anyone working on a pull request for this?

@mlc-mlapis
Copy link

@kylecordes ... shouldn't be "rxjs/operators/*", added also?

bundles: {
    "npm:rxjs-system-bundle@5.5.0/Rx.system.js": [
      "rxjs",
      "rxjs/*",
      "rxjs/operator/*",
      "rxjs/operators/*",
      "rxjs/observable/*",
      "rxjs/scheduler/*",
      "rxjs/symbol/*",
      "rxjs/add/operator/*",
      "rxjs/add/observable/*",
      "rxjs/util/*"
    ]
}

@pitAlex
Copy link

pitAlex commented Nov 17, 2017

I did this to make it work:

packages : {
    "rxjs/operators" : {
         "main": "index.js",
         "defaultExtension": "js"
    }
}

@keithdechant
Copy link

@pitAlex That worked great for me on my Angular 5 app. It's nice to have a workaround that doesn't require editing anything in node_modules.

You're missing a colon after "rxjs/operators", BTW.

@sarunint
Copy link

sarunint commented Dec 3, 2017

This issue is fixed in 5.5.3. All workarounds above can be ignored.

@bevlison
Copy link

I had the error : "looking for rxjs/operators.js",
when loading an angular TS file : "....service.js" ,
line 3 containing : "import { catchError, map, tap } from 'rxjs/operators';"
line 1 containing : "import { Observable } from 'rxjs/Observable';". That line gives no error! (so rxjs is available)

I don't know how relevant this is, but the solution was not changing version (of rxjs), nor editing the file named "systemjs.config.js", (adding a seperated referal to rxjs/operators, as a post above suggested to do). That systemjs file contains : "'rxjs': 'npm:rxjs',", which is explaining the availability of eg. rxjs/Observable in angular TS

SOLUTION for me was : changing line 3 in service file to : "import { catchError, map, tap } from 'rxjs/operators/index';"

EXPLAINED : When checking "./node_modules/rxjs" you won't find a file "operators.js", but you'll find a folder "operators". you could refer to the needed operators, or just all available (choosing for index.js)

Hopefully this solves and explains for others following same tutorials as I'm doing.

@ChandraTerli
Copy link

I am still having the same issue in Angular 6.0.0? does the issue still exists in latest version?

@mlc-mlapis
Copy link

@ChandraTerli ... ??? it was the issue with RxJS itself and not with Angular.

@ChandraTerli
Copy link

ChandraTerli commented May 8, 2018 via email

@ChandraTerli
Copy link

this is what I is in my Package.Json... "rxjs": "6.1.0" and in SystemJs.Config..,
'rxjs/operators': {
'main': 'index.js',
'defaultExtension': 'js'
}

@ChandraTerli
Copy link

and I get this error..
http://localhost:41211/node_modules/rxjs/ 403 (Forbidden)

@mlc-mlapis
Copy link

@ChandraTerli ... but the error is related to rxjs and not to rxjs/operators:

http://localhost:41211/node_modules/rxjs/ 403 (Forbidden)

Are you importing what when the error appears?

@ChandraTerli
Copy link

initial error was rxjs/operators then when I tried to fix it using what I mentioned above it started giving me this error, no not when importing. I am just trying to build a angular6 project and on initial run I see this error(s).

@ChandraTerli
Copy link

{
"name": "angular-quickstart",
"version": "1.0.0",
"description": "QuickStart package.json from the documentation, supplemented with testing support",
"scripts": {
"build": "tsc -p src/",
"build:watch": "tsc -p src/ -w",
"build:e2e": "tsc -p e2e/",
"serve": "lite-server -c=bs-config.json",
"serve:e2e": "lite-server -c=bs-config.e2e.json",
"prestart": "npm run build",
"start": "concurrently "npm run build:watch" "npm run serve"",
"pree2e": "npm run build:e2e",
"e2e": "concurrently "npm run serve:e2e" "npm run protractor" --kill-others --success first",
"preprotractor": "webdriver-manager update",
"protractor": "protractor protractor.config.js",
"pretest": "npm run build",
"test": "concurrently "npm run build:watch" "karma start karma.conf.js"",
"pretest:once": "npm run build",
"test:once": "karma start karma.conf.js --single-run",
"lint": "tslint ./src/**/*.ts -t verbose"
},
"keywords": [],
"author": "",
"license": "MIT",
"dependencies": {
"@angular/animations": "^6.0.0",
"@angular/common": "~6.0.0",
"@angular/compiler": "~6.0.0",
"@angular/core": "~6.0.0",
"@angular/forms": "~6.0.0",
"@angular/http": "~6.0.0",
"@angular/platform-browser": "~6.0.0",
"@angular/platform-browser-dynamic": "~6.0.0",
"@angular/router": "~6.0.0",
"angular-in-memory-web-api": "~0.6.0",
"systemjs": "0.21.3",
"core-js": "^2.5.6",
"rxjs": "6.1.0",
"zone.js": "0.8.26"
},
"devDependencies": {
"concurrently": "^3.2.0",
"lite-server": "^2.2.2",
"typescript": "~2.5.3",
"canonical-path": "0.0.2",
"tslint": "^3.15.1",
"lodash": "^4.16.4",
"jasmine-core": "~2.4.1",
"karma": "^1.3.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~4.0.14",
"rimraf": "^2.5.4",
"@types/node": "^6.0.46",
"@types/jasmine": "2.5.36"
},
"repository": {}
}

@ChandraTerli
Copy link

/**

  • System configuration for Angular samples

  • Adjust as necessary for your application needs.
    */
    (function (global) {
    System.config({
    paths: {
    // paths serve as alias
    'npm:': 'node_modules/'
    },
    // map tells the System loader where to look for things
    map: {
    // our app is within the app folder
    'app': 'app',

    // angular bundles
    '@angular/core': 'npm:@angular/core/bundles/core.umd.js',
    '@angular/common': 'npm:@angular/common/bundles/common.umd.js',
    '@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
    '@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
    '@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
    '@angular/http': 'npm:@angular/http/bundles/http.umd.js',
    '@angular/router': 'npm:@angular/router/bundles/router.umd.js',
    '@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',

    // other libraries
    'rxjs': 'npm:rxjs',
    'angular-in-memory-web-api': 'npm:angular-in-memory-web-api/bundles/in-memory-web-api.umd.js'
    },
    // packages tells the System loader how to load when no filename and/or no extension
    packages: {
    app: {
    defaultExtension: 'js',
    meta: {
    './*.js': {
    loader: 'systemjs-angular-loader.js'
    }
    }
    },
    rxjs: {
    defaultExtension: 'js'
    },
    'rxjs/operators': {
    'main': 'index.js',
    'defaultExtension': 'js'
    }
    }
    });
    })(this);

@mlc-mlapis
Copy link

@ChandraTerli ... it looks that you use SystemJS in the project. Is it an older app? And you want to migrate to Angular 6 now? Then I recommend you to start with a fresh project and with Angular CLI and migrate you previous app step by step.

@adal2404-Real
Copy link

Hello!, taken the @pitAlex recommendations, I makes that change on system.config.js and add a similar rxjs config for the error http://localhost:41211/node_modules/rxjs/ 403 (Forbidden), tested with Angular 6.0.3 and rxjs 6.2.0, and it work!!

  packages: {
        app: {
            defaultExtension: 'js',
            meta: {
                './*.js': {
                    loader: 'systemjs-angular-loader.js'
                }
            }
        },
        rxjs: {
            main: 'index.js',
            defaultExtension: 'js'
        },
        "rxjs/operators": {
            main: 'index.js',
            defaultExtension: 'js'
        }
    }

@FrancescoBorzi
Copy link

I'm having a similar issue since rxjs 6:

GET https://unpkg.com/rxjs@6.2.1/operators.js 404 ()
previewer.483de356abd4ac4365bd.js:1 Error: (SystemJS) Error: XHR error (404) loading https://unpkg.com/rxjs/operators.js
at XMLHttpRequest.wrapFn (https://unpkg.com/zone.js@0.8.26/dist/zone.js:1188:39)
at ZoneDelegate.invokeTask (https://unpkg.com/zone.js@0.8.26/dist/zone.js:421:31)
at Zone.runTask (https://unpkg.com/zone.js@0.8.26/dist/zone.js:188:47)
at ZoneTask.invokeTask [as invoke] (https://unpkg.com/zone.js@0.8.26/dist/zone.js:496:34)
at invokeTask (https://unpkg.com/zone.js@0.8.26/dist/zone.js:1540:14)
at XMLHttpRequest.globalZoneAwareCallback (https://unpkg.com/zone.js@0.8.26/dist/zone.js:1566:17)
Error loading https://unpkg.com/rxjs/operators.js as "rxjs/operators" from https://unpkg.com/@angular/core/bundles/core.umd.js

@ursseenu71
Copy link

@ShinDarth did you find a fix for the error you posted? I am getting the same error with rxjs 6, angular 6. Appreciate your help if you can give me some pointers on how this can be fixed.

@FrancescoBorzi
Copy link

not yet

@FrancescoBorzi
Copy link

@ursseenu71 FYI: I've raised a question here: https://stackoverflow.com/questions/51288263/plunker-error-get-https-unpkg-com-rxjs6-2-1-operators-js-404

I'll post the solution there in case I find one.

@mlc-mlapis
Copy link

@ShinDarth ... entry point for an operator is rxjs/operators ... not 'rxjs'.

lddubeau added a commit to mangalam-research/wed-demo that referenced this issue Jul 26, 2018
This is due to the problem loading it with SystemJS described at:

ReactiveX/rxjs#2971
@lock lock bot locked as resolved and limited conversation to collaborators Aug 10, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.