Angular 5+ngrx v4.1.1使用ofType报错：模块无导出成员

你遇到的问题是因为ngrx v4还没有把ofType实现为pipeable操作符，同时rxjs 5.5.x开始推荐使用pipeable操作符替代原型链上的方法调用，版本差异导致了报错。下面是具体的解决步骤：

1. 修正ofType的使用方式 #

在ngrx v4中，ofType是Actions类的实例方法，而非可单独导入的pipeable操作符，所以你不需要从@ngrx/effects导入ofType。正确做法是先调用this.actions$.ofType()获取筛选后的Observable，再通过pipe应用其他rxjs操作符。

2. 调整Effects的代码结构 #

把原来在pipe里的ofType移到actions$的链式调用中，然后在返回的Observable上使用pipe包裹mergeMap、map、catchError这些pipeable操作符。

修正后的完整代码： #

// ...
import { Action } from '@ngrx/store';
import { Effect, Actions } from '@ngrx/effects'; // 移除ofType的导入
import { map, mergeMap, catchError } from 'rxjs/operators';
import { of } from 'rxjs/observable/of';

@Injectable()
export class WifiEffects {
  @Effect() getWifiData: Observable<Action> = this.actions$
    .ofType(WifiTypes.getWifiNetworks) // 先调用Actions的ofType方法
    .pipe(
      mergeMap((action: GetWifiNetworks) => this.mapService.getWifiNetworks().pipe(
        map((data: WifiNetworks) => new GetWifiNetworksSucc(data)),
        catchError(() => of(new GetWifiNetworksErr()))
      ))
    );

  constructor (
    private actions$: Actions,
    private mapService: GoogleMapDataService
  ) {}
}

错误原因补充 #

• 第一个错误Property 'mergeMap' does not exist on type 'Actions<Action>'：rxjs 5.5.x开始，原型链上的操作符（比如.mergeMap()）被标记为过时，需要改用pipeable版本放到pipe()中。
• 第二个错误Module has no exported member 'ofType'：ngrx v4的ofType还不是独立的pipeable操作符，直到ngrx v5及以上版本才把ofType改为可导入的pipeable操作符，适配rxjs的pipe写法。

如果你后续升级到ngrx v5+，就可以直接使用ofType作为pipeable操作符导入并在pipe中使用了，但在当前v4版本下，上面的写法是唯一兼容的方式。

内容的提问来源于stack exchange，提问作者tprieboj