导入不与 react 和 webpack 一起工作的单个 rxjs 运算符

Question

我正在使用 redux-observable 进行 React 应用程序和 webpack 进行捆绑。

当我包含来自 rxjs 的特定运算符时，例如

import 'rxjs/add/operator/mapTo';

它不起作用并抛出错误

TypeError: action$.ofType(...).mapTo is not a function.

但是当我包含完整的 rxjs 库时，它起作用了

import 'rxjs';

导入特定运算符时，我的 js 包确实包含 mapTo 代码，但这些方法未包含在 Observable 原型中。我正在使用 webpack 进行捆绑。在 webpack 中导入特定的运算符是否需要做一些特别的事情？

代码:

import { combineEpics } from 'redux-observable';
import { BehaviorSubject } from 'rxjs/BehaviorSubject';
import 'rxjs/add/operator/mergeMap';
import 'rxjs/add/operator/mapTo';

const PING = 'PING';
const PONG = 'PONG';

const pingEpic = action$ => {
  const obser = action$.ofType(PING);
  return obser.mapTo({ type: PONG });
}

export const epic$ = new BehaviorSubject(combineEpics(pingEpic));
export const createRootEpic = (action$, store) =>
epic$.mergeMap(epic =>
  epic(action$, store)
);

更新:

mapTo 方法对 BehaviorSubject 对象可用（epic$.mapTo 可用）但对 ActionsObservable 对象不可用（action$.mapTo 不是函数）。

Answer 1

问题很可能是你不小心有两个 RxJS 副本。这可能会在多种情况下发生，但在您的特定情况下，这听起来很有可能 a recently reported issue in rxjs。该特定问题已从 5.5.1 开始修复（5.5.2 现在是最新的）。

确保您安装了 RxJS 5.5.1 或更高版本——如果您的 semver 范围很广，您可能需要删除 node_modules 并重新安装以在本地获得更新的版本。您还可以通过查看 node_modules/rxjs/package.json "version" 字段进行三重检查，通常位于底部

导入不与 react 和 webpack 一起工作的单个 rxjs 运算符

Importing a single rxjs operator not working with react and webpack

rxjs

rxjs5

redux-observable