CODEWITHSUNDEEP
angularrxjs
Chris Edgington
Chris Edgington

Reputation: 3256

Can't resolve 'rxjs/Observable'

I've just been attempting to upgrade an old Angular 7 project to Angular 8 and I'm hitting a strange Rxjs dependency issue. Npm install runs fine but on trying to start the application I'm getting the following -

ERROR in ../node_modules/@angular/core/@angular/core.js
Module not found: Error: Can't resolve 'rxjs/Observable' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\core\@angular'
ERROR in ../node_modules/@angular/http/@angular/http.js
Module not found: Error: Can't resolve 'rxjs/Observable' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\http\@angular'
ERROR in ../node_modules/@angular/core/@angular/core.js
Module not found: Error: Can't resolve 'rxjs/Subject' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\core\@angular'
ERROR in ../node_modules/@angular/forms/@angular/forms.js
Module not found: Error: Can't resolve 'rxjs/observable/forkJoin' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\forms\@angular'
ERROR in ../node_modules/@angular/forms/@angular/forms.js
Module not found: Error: Can't resolve 'rxjs/observable/fromPromise' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\forms\@angular'
ERROR in ../node_modules/@angular/core/@angular/core.js
Module not found: Error: Can't resolve 'rxjs/observable/merge' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\core\@angular'
ERROR in ../node_modules/@angular/forms/@angular/forms.js
Module not found: Error: Can't resolve 'rxjs/operator/map' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\forms\@angular'
ERROR in ../node_modules/@angular/core/@angular/core.js
Module not found: Error: Can't resolve 'rxjs/operator/share' in 'C:\Users\chris\source\repos\myapp\node_modules\@angular\core\@angular'

My package.json looks like this -

"dependencies": {
    "@angular-devkit/schematics": "^13.0.3",
    "@angular/animations": "8.2.14",
    "@angular/cdk": "^8.2.3",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/material": "^8.2.3",
    "@angular/material-moment-adapter": "^8.2.0",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    ...
    "rxjs": "^6.5.3",
    "rxjs-compat": "^6.5.3",
    ...
}

Has anyone come across this before?

Upvotes: 1

Views: 2092

Answers (1)

Med Aziz CHETOUI
Med Aziz CHETOUI

Reputation: 158

it's a problem of dependency alignment between Angular 8 and RxJS, so, to solve it you need to downgrade your rxjs version from 6.5.3 to 6.4.0.

npm i [email protected]

This is package.json file

"dependencies": {
    "@angular-devkit/schematics": "^8.2.2",
    "@angular/animations": "~8.2.14",
    "@angular/cdk": "^8.2.3",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/material": "^8.2.3",
    "@angular/material-moment-adapter": "^8.2.3",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "rxjs": "~6.4.0",
    "rxjs-compat": "^6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
}

Stackblitz link project angular8-rxjs

GitHub link project

I hope we have a useful response and clearly written.

Upvotes: 3

Related Questions