Лучший способ импортировать Observable из rxjs

В моем приложении angular 2 у меня есть служба, которая использует класс Observable из библиотеки rxjs.

import { Observable } from 'rxjs';

В данный момент я просто использую Observable, чтобы использовать функцию toPromise().

Я читал в другом вопросе StackOverflow, где импортирование таким образом, а также импорт из rxjs/Rx будет импортировать из библиотеки rxjs множество ненужных материалов, что увеличит время загрузки страницы и/или базу кода.

Мой вопрос: какой лучший способ импортировать Observable, чтобы я мог использовать функцию toPromise() без необходимости импортировать все остальное?

Ответы

Ответ 1

Rxjs v 5.4.1

Я пишу этот ответ частично, чтобы помочь себе, поскольку я постоянно проверяю документы каждый раз, когда мне нужно импортировать оператора. Дайте мне знать, если что-то можно сделать лучше.

1) import { Rx } from 'rxjs/Rx';

Это импортирует всю библиотеку. Тогда вам не нужно беспокоиться о загрузке каждого оператора. Но вам нужно добавить Rx. Я надеюсь, что встряхивание деревьев будет оптимизировать и выбрать только нужные funcionts (необходимо проверить) Как упоминалось в комментариях, дрожание деревьев не может помочь. Таким образом, это не оптимизировано.

public cache = new Rx.BehaviorSubject('');

Или вы можете импортировать операторы индивидуальные.

Это оптимизирует ваше приложение, чтобы использовать только те файлы:

2) import { _______ } from 'rxjs/_________';

Этот синтаксис обычно используется для основного объекта, например Rx или Observable и т.д.,

Ключевые слова, которые можно импортировать с помощью этого синтаксиса

 Observable, Observer, BehaviorSubject, Subject, ReplaySubject

3) import 'rxjs/add/observable/__________';

Обновление для Angular 5

С Angular 5, который использует rxjs 5.5.2+

import { concat,empty } from 'rxjs/observable';

Обычно они сопровождаются наблюдением непосредственно. Например

Observable.from()
Observable.of()

Другие такие ключевые слова, которые можно импортировать с помощью этого синтаксиса:

concat, defer, empty, forkJoin, from, fromPromise, if, interval, merge, of, 
range, throw, timer, using, zip

4) import 'rxjs/add/operator/_________';

Обновление для Angular 5

С Angular 5, который использует rxjs 5.5.2+

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

Обычно они появляются в потоке после создания Observable. Как flatMap в этом фрагменте кода:

Observable.of([1,2,3,4])
          .flatMap(arr => Observable.from(arr));

Другие ключевые слова, использующие этот синтаксис:

audit, buffer, catch, combineAll, combineLatest, concat, count, debounce, delay, 
distinct, do, every, expand, filter, finally, find , first, groupBy,
ignoreElements, isEmpty, last, let, map, max, merge, mergeMap, min, pluck, 
publish, race, reduce, repeat, scan, skip, startWith, switch, switchMap, take, 
takeUntil, throttle, timeout, toArray, toPromise, withLatestFrom, zip

FlatMap: flatMap является псевдонимом mergeMap, поэтому нам нужно импортировать mergeMap для использования flatMap.

Примечание для /add импорта:

Нам нужно импортировать только один раз в целом проекте. Поэтому он посоветовал сделать это в одном месте. Если они включены в несколько файлов, и один из них будет удален, сборка завершится ошибкой по неверным причинам.