import .of() for Observable in typescript import .of() for Observable in typescript typescript typescript

import .of() for Observable in typescript


You do not have to import {of} from 'rxjs/add/observable/of'. You can directly use

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

Or you can import Observable from "rxjs/Rx" which bundle all the operators. Bad practice

import { Observable } from "rxjs/Rx";

Update 2018-01-26: RxJS v5.5+ pipeable operators

From https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md

Starting in version 5.5 we have shipped "pipeable operators", which can be accessed in rxjs/operators (notice the pluralized "operators"). These are meant to be a better approach for pulling in just the operators you need than the "patch" operators found in rxjs/add/operator/*.

Now that "patching" imports are going to be deprecated, it would be better to use strict imports.

import { of as observableOf } from 'rxjs/observable/of'

and use it like that

const myObs$: Observable<number> = observableOf(1, 2, 3)


RxJS 6

Starting with RxJS 6, the imports were greatly simplified and cause less confusion now thanks to a more intuitive API surface:

  1. Creation methods like of are directly imported from 'rxjs':

    import { of } from 'rxjs';

  2. All pipeable operators are imported from 'rxjs/operators', e.g.:

    import { tap, map } from 'rxjs/operators';


Migration:

If you're updating directly from RxJS 5, you can even utilize the TSLint rules for RxJS, which will automatically fix your imports to the newer, simplified API:

  1. npm i -g rxjs-tslint
  2. rxjs-5-to-6-migrate -p [path/to/tsconfig.json]