rxjs-redux observable not compiling after installing, issue with node modules

Question

After two days of fighting with the bare installation and attempting to implement the simplest of examples following a guide of Egghead.

I am having trouble with node modules finding any of its components for some reason.

Epics Index:

import { Observable } from 'rxjs';
import {combineEpics} from 'redux-observable';

function loadStoriesEpic(action$) {
    return action$
        .do(action => console.log(action))
        .ignoreElements();
}

export const rootEpic = combineEpics(loadStoriesEpic);

My actual error on console that doesn't compiles.

RROR in ./node_modules/rxjs/Observable.js Module not found: Error: Can't resolve 'rxjs-compat/Observable' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs' @ ./node_modules/rxjs/Observable.js 6:9-42 @ ./node_modules/redux-observable/lib/esm/ActionsObservable.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src

ERROR in ./node_modules/rxjs/Subject.js Module not found: Error: Can't resolve 'rxjs-compat/Subject' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs' @ ./node_modules/rxjs/Subject.js 6:9-39 @ ./node_modules/redux-observable/lib/esm/createEpicMiddleware.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src

ERROR in ./node_modules/rxjs/observable/from.js Module not found: Error: Can't resolve 'rxjs-compat/observable/from' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs/observable' @ ./node_modules/rxjs/observable/from.js 6:9-47 @ ./node_modules/redux-observable/lib/esm/ActionsObservable.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src

ERROR in ./node_modules/rxjs/observable/merge.js Module not found: Error: Can't resolve 'rxjs-compat/observable/merge' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs/observable' @ ./node_modules/rxjs/observable/merge.js 6:9-48 @ ./node_modules/redux-observable/lib/esm/combineEpics.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src

ERROR in ./node_modules/rxjs/observable/of.js Module not found: Error: Can't resolve 'rxjs-compat/observable/of' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs/observable' @ ./node_modules/rxjs/observable/of.js 6:9-45 @ ./node_modules/redux-observable/lib/esm/ActionsObservable.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src

ERROR in ./node_modules/rxjs/operator/filter.js Module not found: Error: Can't resolve 'rxjs-compat/operator/filter' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs/operator' @ ./node_modules/rxjs/operator/filter.js 6:9-47 @ ./node_modules/redux-observable/lib/esm/operators.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src

ERROR in ./node_modules/rxjs/operator/map.js Module not found: Error: Can't resolve 'rxjs-compat/operator/map' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs/operator' @ ./node_modules/rxjs/operator/map.js 6:9-44 @ ./node_modules/redux-observable/lib/esm/createEpicMiddleware.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src

ERROR in ./node_modules/rxjs/operator/switchMap.js Module not found: Error: Can't resolve 'rxjs-compat/operator/switchMap' in '/Users/laxosceles/react-portfolio-solstice/node_modules/rxjs/operator' @ ./node_modules/rxjs/operator/switchMap.js 6:9-50 @ ./node_modules/redux-observable/lib/esm/createEpicMiddleware.js @ ./node_modules/redux-observable/lib/esm/index.js @ ./src/index.js @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src Child html-webpack-plugin for "index.html": Asset Size Chunks Chunk Names db7499f085244c16cc8c.hot-update.json 44 bytes [emitted]
+ 1 hidden asset Entrypoint undefined = ./index.html

I do not think it has something to do with the issue, but yet I am going to say it , I recently added Yarn to my project and now I installed it with "yarn add" I do not think it should be an issue given the dependency shows in my package.json

Tomasz Mularczyk Tomasz Mularczyk · Accepted Answer · 2018-05-10T07:45:11

I bet you are using rxjs v6 and redux-observable v.0.x because I see there are imports errors (that's what has been the breaking change in rxjs v6 and redux-observable v.0.x is compatible with rxjs5).

You need to upgrade redux-observable or downgrade rxjs to version 5.

A github issue.

rxjs-redux observable not compiling after installing, issue with node modules

1 Answers