74

I am currently upgrading angular 4 to angular 6 code. I have installed "rxjs": "^6.3.2" and un-installed rxjs-compact as I have migrated the code to use the new rxjs operators. I am still getting the following errors. Dont know the reason why

ERROR in [at-loader] ./node_modules/rxjs/BehaviorSubject.d.ts:1:15
    TS2307: Cannot find module 'rxjs-compat/BehaviorSubject'.

ERROR in [at-loader] ./node_modules/rxjs/Observable.d.ts:1:15
    TS2307: Cannot find module 'rxjs-compat/Observable'.

ERROR in [at-loader] ./node_modules/rxjs/Observer.d.ts:1:15
    TS2307: Cannot find module 'rxjs-compat/Observer'.

ERROR in [at-loader] ./node_modules/rxjs/Operator.d.ts:1:15
    TS2307: Cannot find module 'rxjs-compat/Operator'.

ERROR in [at-loader] ./node_modules/rxjs/Subject.d.ts:1:15
    TS2307: Cannot find module 'rxjs-compat/Subject'.

ERROR in [at-loader] ./node_modules/rxjs/Subscription.d.ts:1:15
    TS2307: Cannot find module 'rxjs-compat/Subscription'.
5
  • 1
    Have you accidentally left any import statements in your code referencing the rxjs-compat package? Sep 18, 2018 at 14:41
  • 1
    Try npm install rxjs@6 rxjs-compat@6 --save
    – Peter Kim
    Sep 18, 2018 at 14:43
  • Hi Peter do i really need to install xjs@6 rxjs-compat@6. Shouldn't the new rxjs 6 work without it
    – Tom
    Sep 18, 2018 at 14:45
  • 2
    @Tom Try importing modules like this import { Observable } from 'rxjs';
    – Peter Kim
    Sep 18, 2018 at 15:08
  • Have u tried this npm install --save rxjs@5.5.2?
    – Dungeon
    Oct 9, 2018 at 10:17

17 Answers 17

117

None of these answers are correct. Installing rxjs-compat is just a workaround. All you have to do is correct the imports. Use:

import { Observable } from 'rxjs';

Instead of:

import { Observable } from 'rxjs/Observable';

This last import is supposed to go away when they finally decide to kill rxjs-compat (hopefully very soon)... so heads up! you need to update your code!!

5
  • 1
    Can we use the same in package.json etc? I really dont want to execute this on each developers machine
    – PAA
    Oct 4, 2019 at 16:17
  • 1
    I'm not sure I follow your question. Unfortunately, you have to either update all the imports (a regular search and replace will suffice) or use the compat package (which I don't recommend since it's a temporary workaround). The package.json will only ensure the version of the packages you're using, what you do with them is in the code. Oct 8, 2019 at 2:02
  • 2
    This answer needs to be upvoted more because it is the best answer Aug 9, 2020 at 14:21
  • 1
    Also see rxjs-dev.firebaseapp.com/guide/v6/migration#import-paths for a list of all imports you might have to change Oct 27, 2020 at 14:16
  • Even angular university can get this wrong: blog.angular-university.io/angular-http
    – Deepstop
    Sep 24, 2022 at 14:53
109

This will solve the issue:

npm install --save rxjs-compat 

See this GitHub issue

Edit : as per 10th October 2019 ,you can use below syntax as the earlier or the above one was a workaround.

import { Observable } from 'rxjs/Observable';

Reference doc: https://github.com/ReactiveX/rxjs/blob/master/docs_app/content/guide/v6/migration.md#dropping-the-compatibility-layer

3
  • 1
    Do I need to add that as a dependency in the package.json file. I have upgraded all the rxjs operators in the application to use new rxjs 6 functionality. Unfortunately the d.ts files under the observable are referring to rxjs-compat. for e.g export * from 'rxjs-compat/observable/bindNodeCallback';.
    – Tom
    Oct 9, 2018 at 11:38
  • @Tom no need to add the dependency manually as cli does for you.So your package.json will have "rxjs-compat": "^6.3.3" as an entry under "dependencies" node. Oct 27, 2018 at 8:21
  • 6
    this shouldn't be the correct answer... using the rxjs-compat is just a temporary solution they created to keep using old imports safely in the new version... what you should do is update your imports. See my answer below 👇 Jun 3, 2019 at 17:07
8

As, Jandro Rojas, already said, installing rxjs-compat dependency it's only a temporary walkaround. In the future, you still need to fix that. The best solution is to use an Angular update guide https://update.angular.io/ because of some mistakes can be fixed automatically.

From my experience with errors "Cannot find module 'rxjs-compat/Observable'", "Cannot find module 'rxjs-compat'" and etc.

  • You should fix all the imports. From:
import { Observable } from 'rxjs/Observable'

To:

import { Observable } from 'rxjs'
  • If you use RxJS observables classes or etc, you need to update your code. Use this guide -> RxJS v5.x to v6 Update Guide

  • Check carefully your dependencies, it should be updated too to use the newest RxJs. In my case "ngx-bootstrap" was outdated.

7
npm install --save rxjs-compat

and run the server again with ng serve

This works for me.

4

Just open command prompt & add below command in to your root folder.

npm i rxjs-compat

Hope it's working ..

2
import { Observable } from 'rxjs';

this will be enough, there's no need for other imports

1

Both the rxjs and rxjs-compat of the version 6.3.2 worked for me.

npm install rxjs@6.3.2 --save  &&  npm install rxjs-compat@6.3.2 --save
1
  • ] node_modules/rxjs/Observable.d.ts(1,15): error TS2307: Cannot find module 'rxjs-compat/Observable'

I have got same above error, to resolve the issue enter this command in you CLI:

  • npm install --save rxjs-compat

Then after import: import { Observable } from 'rxjs';

1

Those who have this error while creating a salesforce project in VSCode, should ensure that the command - npm install rxjs@6.3.2 --save && npm install rxjs-compat@6.3.2 --save

are installed in - C:\Program Files\Salesforce CLI\client\node_modules directory

1

It worked for me just by replacing 'rxjs/Subscription' with 'rxjs'

1

It looks like rxjs-compat is missing. just do

npm i rxjs-compat 

npm install
0
npm install --save rxjs-compat

import { Observable } from 'rxjs'

run server ng serve worked for Me

0
npm i rxjs-compat

It's working for me.

0

npm uninstall @ngrx/store

npm install @ngrx/store@5.2.0

npm install --save rxjs-compat

1
  • Please add further details to expand on your answer, such as working code or documentation citations.
    – Community Bot
    Aug 30, 2021 at 22:10
0

in package.json add dependency "rxjs": "^6.5.4" then yarn install

or yarn add rxjs@^6.5.4

0
  1. install rxjs if not installed:

    npm install --save rxjs-compat

2-import observable:

import {Observable} from "rxjs";

instead of:

import {Observable} from "rxjs/dist/types";
-1

I am using Angular 10,this method works for me.

npm install --save rxjs-compat

you should import observable this way:-

import { Observable } from 'rxjs/Observable';

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.