试图了解RxJS导入

Question

我很难弄清楚这个import语句究竟是如何工作的（在一个用Typescript编写的Angular应用程序中）：

import 'rxjs/add/operator/toPromise';

我得到rxjs映射到SystemJS配置文件中的相应node_modules子文件夹，但后来我被卡住了。我看到有一个index.js文件，但我不知道这是否或如何有助于解决add/operator/...部分。

同样，我不明白这个：

import {Observable} from 'rxjs/Observable';

同样，这个地方没有文件Observable.*文件。我猜它在某种程度上可以通过index.js文件工作，但我真的希望得到一个更透彻的理解，因为我读到很容易导入所有RxJS，这增加了页面加载时间。

我仔细研究了Typescript模块解析文档，但我觉得这还不足以解释它。

更新：在阅读下面接受的答案后，我发现我一直在查看node_modules/rx目录而不是node_modules/rxjs，因此import语句与目录结构完全匹配

Answer 1

这非常简单，因为默认情况下TypeScript会查看node_modules目录。

导入以下内容：

import {Observable} from 'rxjs/Observable';

被解析为node_modules/rxjs/Observable.d.ts，这足以编译代码。

同样，导入rxjs/add/operator/toPromise已解析为node_modules/rxjs/add/operator/toPromise.ts。顺便说一下，您可以使用--traceResolution编译器选项来查看测试的TypeScript路径。

当您拥有已编译的JS（例如，commonjs格式）时，您可以在node中运行您的应用，因为它会调用require('rxjs/Observable')，这将解析为{{1} }}。然后与node_modules/rxjs/Observable.js类似。

请注意，RxJS github页面的代码结构与实际的npm包不同。基本上，仅将rxjs/add/operator/toPromise和src目录与已编译的package.json和.js文件上传到npm存储库（原始.d.ts源文件位于{ {1}}但你永远不想直接与他们合作。）