observable.of cannot be found in version 6.0.0-tactical-rc.1

Question

Im building service that should temporarily return Observable of some array before the server API will constructed. Before upgrading to angular and other packages to 6.0.0-rc.3 version i used following syntax:

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/observable/of';


@Injectable()
export class GeocodesService {
   getPositions():Observable<any>{     
        return Observable.of({ })
   }
}

At 6.0.0-rc.3, this syntax looks deprecated Trying to import it following way (using latest angular):

 import 'rxjs/observable/of'

But Getting error:

Module not found: Error: Can't resolve 'rxjs/observable/of'

How import of "of" can be done with latest rxjs?

Thanks

If you're using RxJS 5.5 it's `import 'rxjs/add/observable/of'. In RxJS 5.6 you should use `import { of } from 'rxjs/observable/of'` — martin, Apr 11 '18 at 08:51
Possible duplicate of [Observable.of is not a function](https://stackoverflow.com/questions/36568388/observable-of-is-not-a-function) — bugs, Apr 11 '18 at 08:52
tryed this way already - getting: node_modules/rxjs/observable/of"' has no exported member 'of' — happyZZR1400, Apr 11 '18 at 08:55
yes, the result is "Error: Can't resolve 'rxjs/operator/of'" — happyZZR1400, Apr 11 '18 at 09:23

score 9 · Answer 1 · answered Apr 11 '18 at 09:33

9

Finally found the solution here

This guy (Tomas Trajan), uses following syntax:

import { Observable , of} from 'rxjs'

and after you can use:

 getWidgets() {
    return of([]);
 }

answered Apr 11 '18 at 09:33

happyZZR1400

2,387
3
25
43

1

I kept trying to `Observable.of` you're the first to explain the fix which is just to use `of` Thanks! – seabass May 16 '18 at 19:27

cartant · Answer 2 · 2018-04-13T23:46:04.740

6

If you want to use the patching imports with RxJS version 6, you will also need to install rxjs-compat.

It's a separate package that adds backwards compatibility (with RxJS version 5) to RxJS version 6:

npm install rxjs-compat@6.0.0-tactical-rc.1

With rxjs-compat installed, your patching imports should work just fine.

For more information, see the migration guide.

edited Apr 13 '18 at 23:46

answered Apr 11 '18 at 09:03

cartant

57,105
17
163
197

Discoverability seems like a major issue. – Aluan Haddad Apr 11 '18 at 09:05
I believe there is a migration guide that's being prepared. – cartant Apr 11 '18 at 09:05
That is good but plenty of people will not realize that they need to migrate at all, especially if they get upgraded transitively. I think the better approach would have been to leave it alone. – Aluan Haddad Apr 11 '18 at 09:08
patching imports - does this mean the "tactical" have no more "of" operator? – happyZZR1400 Apr 11 '18 at 09:10
Patching imports are those like `import "rxjs/add/..."`. They've been removed in v6. The `rxjs-compat` package adds them back. Patching imports have numerous problems; problems explicit factory imports and [pipeable operators do not have](https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md). Personally, I'm glad they are gone. – cartant Apr 11 '18 at 09:19
1

+1 glad they are gone. Upgrading from 5.x.x to 6.0.0 means that there are breaking changes to be aware of, so people doing this transition should handle this carefully eg reading changelogs, release details or migration guides. – Jota.Toledo Apr 11 '18 at 09:46
The [migration guide](https://github.com/ReactiveX/rxjs/blob/master/MIGRATION.md) has just been updated. – cartant Apr 13 '18 at 23:45

score 1 · Answer 3 · answered May 16 '18 at 09:50

You must change your imports and your instantiation. Check out Damien's blog post

Tl;dr:

import { Observable, fromEvent, of } from 'rxjs';

const yourResult = Observable
    .create(of(yourObservable))
    .startWith(null)
    .map(x => x.someStringProperty.toLowerCase());

//subscribe to keyup event on input element
Observable
    .create(fromEvent(yourInputElement, 'keyup'))
    .debounceTime(5000)
    .distinctUntilChanged()
    .subscribe((event) => {
        yourEventHandler(event);
    });

score 0 · Answer 4 · answered Jul 20 '19 at 17:16

0

Using :

import {of} from 'rxjs';

throw error in Angular v6 or 6+

use like this:

import {of as useOf } from 'rxjs';

............... .... ..............

getBooks():Observable<Book[]>{
return useOf(this.BOOKS);

}

Error Solved!!!

answered Jul 20 '19 at 17:16

Aman Gupta

658
1
8
14

observable.of cannot be found in version 6.0.0-tactical-rc.1

4 Answers4