RxJS: Reactive Extensions For JavaScript

7.8.2 · active · verified Sat Apr 18

RxJS (Reactive Extensions for JavaScript) is a library for reactive programming using Observables, making it easier to compose asynchronous or callback-based code sequences. The current stable version is 7.8.2, with an active roadmap towards version 8, including regular alpha releases and maintenance updates.

Common errors

```
Module not found: Can't resolve 'rxjs/operators'
```
cause Attempting to import operators from 'rxjs/operators' in RxJS version 7.2 or later.

fix Import operators directly from 'rxjs' instead, e.g., `import { map } from 'rxjs';`.
```
TypeError: Subject.create is not a function
```
cause Calling the `create` static method on `Subject` in RxJS v8 or later.

fix Instantiate `Subject` directly using its constructor: `const subject = new Subject();`.
```
TypeError: Cannot read properties of undefined (reading 'subscribe')
```
cause An Observable was created but its `subscribe()` method was not called, preventing it from executing.

fix Ensure `observable.subscribe()` is called to activate the Observable and start emitting values.
```
Property 'pipe' does not exist on type 'Observable<any>'
```
cause Attempting to use an operator directly on an Observable instance without using the `.pipe()` method.

fix Wrap your operators within a `.pipe()` call: `observable.pipe(operator1(), operator2()).subscribe(...)`.

Warnings

breaking The `Symbol.observable` export has been removed.
Fix: Do not rely on `Symbol.observable` being exported for custom interop. Use `Symbol.observable` directly from `Symbol` if needed for custom implementations.
breaking The deprecated `Subject.create` method has been removed.
Fix: Instantiate `Subject` directly using `new Subject()` instead of calling `Subject.create()`.
breaking `WebSocketSubject` no longer extends `Subject`.
Fix: Update code that relies on `WebSocketSubject` having all the methods and properties of a `Subject`.
gotcha Operator import paths changed in RxJS 7.2.
Fix: Import all operators directly from `'rxjs'` (e.g., `import { map } from 'rxjs';`). Using `import { map } from 'rxjs/operators';` is for versions below 7.2 and may cause issues or larger bundle sizes in newer versions.

Install

npm install rxjs npm
yarn add rxjs yarn
pnpm add rxjs pnpm

Imports

range, filter, map
wrong:
```
import { filter, map } from 'rxjs/operators';
```
correct:
```
import { range, filter, map } from 'rxjs';
```
For RxJS versions 7.2 and above, all creation functions and operators are imported directly from 'rxjs'. For versions below 7.2, operators were imported from 'rxjs/operators'.

Quickstart

Demonstrates creating an Observable from a range, applying `filter` and `map` operators using `.pipe()`, and subscribing to log the results.

import { range, filter, map } from 'rxjs';

range(1, 200)
  .pipe(
    filter(x => x % 2 === 1),
    map(x => x + x)
  )
  .subscribe(x => console.log(x));

view raw JSON →