angular - 如何在不需要 rxjs-compat 的情况下只导入 RxJS 6 中使用的运算符,如旧的 RxJS?

标签 angular typescript rxjs rxjs6

以前我只能使用此代码导入使用过的运算符:

import 'rxjs/Observable';
import 'rxjs/add/operator/map';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/finally';
import 'rxjs/add/observable/empty';
import 'rxjs/add/observable/throw';

这会生成一个小包 (vendor.ts)。
如何在不需要 rxjs-compat 的情况下使用 RxJS 做到这一点?
将上面的代码更改为 import 'rxjs'; 会生成一个更大的包。

更新:

我遵循了您发布的所有答案,但没有任何效果。 这是我更新的 vendor.ts:

import 'rxjs/Observable';
import 'rxjs/Subscription';
import 'rxjs/Subject';
import 'rxjs/observable/throw';
import 'rxjs/operators/map';
import 'rxjs/operators/mergeMap';
import 'rxjs/operators/catchError';
import 'rxjs/operators/finalize';

我也尝试过使用 'rxjs/add/operator/*'。

这就是我导入 rxjs 的方式:

import {Observable} from 'rxjs/Observable';
import {Subscription} from 'rxjs/Subscription';
import {Subject} from 'rxjs/Subject';
import {_throw} from 'rxjs/observable/throw';
import {map} from 'rxjs/operators/map';
import {mergeMap} from 'rxjs/operators/mergeMap';
import {catchError} from 'rxjs/operators/catchError';
import {finalize} from 'rxjs/operators/finalize';   

我根据此文档 (https://github.com/ReactiveX/rxjs/blob/master/doc/pipeable-operators.md#build-and-treeshaking) 更改了我的 Webpack 3 配置,但没有任何效果。

最后,看看 Webpack Bundle Analyzer 的结果:

enter image description here

bundle 包括所有运算符。 我发现了这个相关的问题: https://github.com/angular/angular-cli/issues/9069

最佳答案

rxjs-compat应该和rxjs一起安装,它提供了对旧式导入的支持。

可以像使用 RxJS 5 一样使用 RxJS 6:

import 'rxjs/add/operator/map';
import { Observable } from 'rxjs/Observable';

这个兼容层预计会在 RxJS 7 中被移除。

关于angular - 如何在不需要 rxjs-compat 的情况下只导入 RxJS 6 中使用的运算符,如旧的 RxJS?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50415719/

相关文章:

Angular 6 | Webpack 生产构建错误

Angular7 + REDUX : Error: "ExpressionChangedAfterItHasBeenCheckedError: Expression has changed after it was checked

Typescript - 基于另一个属性的条件属性

typescript - 受歧视的联合是否只适用于文字类型?

Angular2 rxjs - switchmap 捕获错误

javascript - 必须在订阅中嵌套服务调用的 Angular 5 activatedroute

javascript - Angular 保存编辑的内容

angular - 将超链接添加到 Angular 2 Toast 消息

javascript - 单击图标无法导航到新页面

c# - 响应式扩展 SelectMany 和 Concat