仅从 Angular 2 组件中的 rxjs 导入所需的功能

Question

我正在开发一个使用 angular cli 引导的 angular 2 项目。我需要第一次加载非常快。这就是为什么尝试减少所有捆绑包大小的原因。

让我头疼的是 rxjs 库，因为它显着增加了包大小。我正在寻找导入技巧以使树摇动起作用，从而进一步减小块大小。我使用了 vscode 的导入建议，它们在编码时工作，但在构建 cli 时显示无法解析这些路径的错误。

这行不通

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

我不得不求助于

import { Observable } from 'rxjs/Rx';

是否有其他方法可以导入特定的运算符。

Answer 1

根据您使用的 RxJs 版本，有两种方法可以做到这一点。

对于旧版本 (

import 'rxjs/add/observable/of'

并从

导入Observable

import { Observable } from 'rxjs/Observable';

从 rxjs/Rx 导入实际上会获取整个库，所以这就是它不适合你的原因。此外，由于旧的导入方式会修补 Observable 原型，因此您只需导入一次操作符。通常会将它们分组到每个应用程序的一个文件中，并仅在需要的地方导入 Observable。

在新的 RxJs 中，从 6.0 版 开始，导入工作的方式进行了重构，特别是为了更容易摇树，因此可以简单地导入以下所有内容：

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