未导入完整RxJS时Observable.of无法编译的原因咨询

这个问题其实是RxJS早期版本（v5及之前）里很常见的导入误区，我来给你拆解清楚：

问题根源 #

你最初的代码只导入了Observable类本身，但**of是RxJS的创建型操作符，需要单独导入才能挂载到Observable的静态方法上**。TypeScript的类型检查会因为找不到这个未导入的方法而报错。

你的初始代码：

import {Observable} from "rxjs/Observable";
userSignedIn$: Observable<boolean>; // 流的命名约定以$结尾
this.userSignedIn$ = Observable.of(false)

为什么导入import * as Rx from "rxjs"能解决？ #

这个导入方式会把整个RxJS库的所有导出（包括所有操作符、类、工具函数）全部加载进来，相当于一次性引入了所有依赖，自然Observable.of就能被找到。不过这种方式不推荐在生产环境使用——它会让打包后的文件体积变大，除非你有完善的tree-shaking配置来剔除未使用的代码。

更优雅的解决方案 #

根据RxJS版本的不同，有几种更合理的写法：

1. 针对RxJS v5及更早版本：单独导入操作符

只导入需要的of操作符，挂载到Observable上：

import {Observable} from "rxjs/Observable";
import "rxjs/add/observable/of"; // 显式导入of操作符

userSignedIn$: Observable<boolean>;
this.userSignedIn$ = Observable.of(false);

或者直接导入of函数，不用静态方法的形式：

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

userSignedIn$: Observable<boolean>;
this.userSignedIn$ = of(false);

2. 针对RxJS v6+版本（推荐）

RxJS v6重构了模块结构，所有操作符都可以直接从rxjs包导入，写法更简洁：

import {Observable, of} from "rxjs";

userSignedIn$: Observable<boolean>;
this.userSignedIn$ = of(false);

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