Angular - “没有导出成员'Observable'”答案

【问题标题】：Angular - "has no exported member 'Observable'"Angular - “没有导出成员'Observable'”
【发布时间】：2018-09-25 04:19:43
【问题描述】：

打字稿代码：

import { Injectable } from '@angular/core';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { Hero } from './hero';
import { HEROES } from './mock-heroes';

@Injectable({
  providedIn: 'root'
})
export class HeroService {

  constructor() { }

  getHeroes(): Observable<Hero[]> {
    return of(HEROES);
  }

}

错误信息：

错误 TS2307：找不到模块“rxjs-compat/Observable”。 node_modules/rxjs/observable/of.d.ts(1,15)：错误 TS2307：找不到模块'rxjs-compat/observable/of'。 src/app/hero.service.ts(2,10)：错误 TS2305：模块 '"F:/angular-tour-of-heroes/node_modules/rxjs/Observable"' 没有导出成员“可观察”。 src/app/hero.service.ts(15,12)：错误 TS2304：找不到名称“of”。

package.json Angular 版本的文件：

【问题讨论】：

您使用的框架名为 Angular。 AngularJS 是一个不同的框架。
看来您使用的是 RxJS 6。使用该版本时需要更改导入（请参阅发行说明）。如果你不使用 Angular 6，那么你应该坚持使用 RxJS 5。
谢谢。我正在使用 Angular6.0 ~
这里是相关文档：next.angular.io/guide/rx-library。请注意，导入的不是您正在使用的。

标签： angular typescript rxjs angular6 rxjs6

【解决方案1】：

我把原来的代码换成import { Observable, of } from 'rxjs'，问题就解决了。

【讨论】：

【解决方案2】：

我遇到了类似的问题。将 RXJS 从 6.x 恢复到最新的 5.x 版本，为 Angular 5.2.x 修复了它。

打开 package.json。

将"rxjs": "^6.0.0", 更改为"rxjs": "^5.5.10",

运行npm update

【讨论】：

我认为这是最好的做法，因为 rxjs 6 仅支持 Angular 6。

【解决方案3】：

这可能对 Angular 6 有帮助，更多信息请参考Document

rxjs：创建方法、类型、调度程序和实用程序

import { Observable, Subject, asapScheduler, pipe, of, from, interval, merge, fromEvent } from 'rxjs';

rxjs/operators：所有可管道操作符：

从 'rxjs/operators' 导入 { map, filter, scan };

rxjs/webSocket： web socket 主题实现

从 'rxjs/webSocket' 导入 { webSocket };

rxjs/ajax：Rx ajax 实现

从 'rxjs/ajax' 导入 { ajax };

rxjs/testing：测试实用程序

从 'rxjs/testing' 导入 { TestScheduler };

【讨论】：

你怎么能解决这个问题？从第一手？搜索 SO 是可行的，但如果该库使用得不太好。
npm install rxjs-compat --save

【解决方案4】：

使用return Observable.of(HEROES);

【讨论】：

虽然这个答案可能是正确且有用的，但最好在其中附上一些解释来解释它如何帮助解决问题。如果有更改（可能不相关）导致它停止工作并且用户需要了解它曾经是如何工作的，这在未来变得特别有用。
如果你仔细阅读这个问题，你会看到提到 Angular 6 和 rxjs 6，而不是 5。这个问题是 rxjs 特有的v6+，而您发布的解决方案与 rxjs（和 Angular）v5 有关。

【解决方案5】：

我的解决方案是添加以下导入： import { of } from 'rxjs/observable/of';

所以修改后 hero.service.ts 的整体代码为：

import { Injectable } from '@angular/core';
import { Hero } from './hero';
import { HEROES } from './mock-heroes';
import { of } from 'rxjs/observable/of';
import {Observable} from 'rxjs/Observable';

@Injectable()
export class HeroService {

  constructor() { }

  getHeroes(): Observable<Hero[]> {
    return of(HEROES);
  }
}

【讨论】：

那是他开始的错误，导出不存在。

【解决方案6】：

简单地说：

import { Observable} from 'rxjs';

就这样。没有更多或更少。

【讨论】：

使用 'rxjs' 而不是 'rxjs/Observable' 刚刚解决了我的问题。我认为，问题的所有者应该接受您的回答。
这肯定会奏效。但是它也支持 Tree Shaking 吗？

【解决方案7】：

显然（正如您在错误日志中指出的那样），在更新到 Angular 6.0.0 后，rxjs-compat 丢失了。

运行npm install rxjs-compat --save 进行安装。应该修复它。

【讨论】：

我也面临同样的问题，但如果我不想使用向后兼容包怎么办？
如果我们不想使用 rxjs-compat 怎么办？
这应该是正确的答案。这不是前进的正确答案……但绝对是“现在”的答案。

【解决方案8】：

在我的情况下，发生此错误是因为我的计算机中有旧版本的 ng cli。

运行后问题解决：

ng update

ng update @angular/cli

【讨论】：

【解决方案9】：

Angular 6 不支持 angular-split 组件，因此要使其与 Angular 6 兼容，请在您的应用程序中安装以下依赖项

要让它工作直到它更新使用：

"dependencies": {
"angular-split": "1.0.0-rc.3",
"rxjs": "^6.2.2",
    "rxjs-compat": "^6.2.2",
}

【讨论】：

【解决方案10】：

您使用的是 RxJS 6。只需替换

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

通过

import { Observable, of } from 'rxjs';

【讨论】：

【解决方案11】：

帮助我的是：

摆脱所有旧的导入路径并用新的替换它们，如下所示：

import { Observable , BehaviorSubject } from 'rxjs';)
删除node_modules文件夹
npm cache verify
npm install

【讨论】：

【解决方案12】：

只需从'rxjs/Observable'; 中删除/Observable

如果你得到Cannot find module 'rxjs-compat/Observable'，只需将下面的行放到终端并按回车键。

npm install --save rxjs-compat

【讨论】：

【解决方案13】：

更新 angular-in-memory-web-api 版本。在教程 angular-tour-of-heroes 期间安装的默认 angular-in-memory-web-api 版本为 0.4。在我的情况下，它就像一个魅力。（使用 Angular 7 和 RxJS 6）

npm i angular-in-memory-web-api@0.8.0

【讨论】：

【解决方案14】：

试试这个：

npm install rxjs-compat --save

【讨论】：

实际上这解决了 angular 8 ionic 5 中的问题
确认！使用 Ionic 5 在 Angular 9 中工作。

【解决方案15】：

你还没有安装rxjs库请安装

npm install rxjs-compat --save

【讨论】：