将RxJS与TypeScript一起使用

Question

我在尝试将RxJS与TypeScript和Node.js一起使用时遇到问题。我正在使用NPM，并且我已经包含了rxjs-es版本5.我也在使用Typings，我同时包含es6-shim和rx.all，如下所示：

{
  "ambientDependencies": {
    "es6-shim": "registry:dt/es6-shim#0.31.2+20160317120654",
    "rx.all": "registry:dt/rx.all#2.2.28+20160316155526"
  }
}

以下是我的tsconfig.json文件。

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": false
  },
  "exclude": [
    "node_modules",
    "typings/browser",
    "typings/browser.d.ts"
  ]
}

在TypeScript文件中，我尝试执行以下操作：

import { Observable } from 'rxjs/Observable';

当我尝试编译脚本时，出现以下错误：

typings/main/ambient/rx.all/index.d.ts(10,11): error TS2304: Cannot find name 'Rx'.

即使我尝试在我的脚本中使用RxJS，也会发生这种情况，因此问题与TypeScript类型有关。

为了使用RxJS，我需要使用typings和NPM安装什么？特别是，我对使用Observables很感兴趣。谷歌搜索几个小时后，我似乎无法弄清楚我需要做些什么来使它工作。我试过the following，但没有运气。我也在NPM和打字中尝试了很多rx包的组合，但是没有发现任何可行的东西。非常感谢任何帮助！

Answer 1

RxJS 5是用typescript编写的，默认情况下它的类型定义包含在已发布的模块中，您可能不需要rx.all的输入。实际上，这些类型定义是为以前版本的RxJS编写的。只需卸载rx.all类型定义，然后尝试在没有这些定义的情况下导入。

Answer 2

Angular（不是AngularJS）实现此目的的正确方法是使用npm中的@types。命令如下：

npm install @types/rx --save-dev

有关详细信息，请参阅npm。

Answer 3

通常，您不需要单独安装打字，只需在项目中包含rxjs/Rx即可（请注意包名称）：

// installed with `$ npm i rxjs`
import { Observable } from 'rxjs/Rx' // <- rxjs from NPM

Observable
    .of('Hello')
    .map( w => w + ' world!') // Annotated properly: (w: string) => string
    .subscribe(console.log.bind(console)) // 'Hello world!'

我的.tsconfig（节点）

不应该相关，但随意使用/比较。

{
    "compilerOptions": {
        "target": "es2015",
        "module": "commonjs",
        "moduleResolution": "node",
        "sourceMap": true,
        "removeComments": false,
        "noImplicitReturns": true,
        "noImplicitAny": true,
        "preserveConstEnums": true
    },
    "exclude": [
        "logs",
        "node_modules"
    ]
}

Answer 4

该打字文件取决于Rx：

declare module "rx.all" {
    export = Rx;
}

尝试安装＆＃34; rx＆＃34;以及＆＃34; rx.all＆＃34;：

typings install rx --save --ambient

但请注意这些类型假设您正在导入＆＃34; rx.all＆＃34;或＆＃34; rx＆＃34;所以你的导入不会给你输入信息：

import { Observable } from 'rxjs/Observable';

你可以从＆＃34; rx＆＃34;而不是＆＃34; rxjs＆＃34;？

import { Observable } from 'rx';

Answer 5

您可以在CLI中输入以下内容来安装RXJS的输入。

typings install --global dt~es6-shim --save

这会将以下内容添加到您的typings.json "es6-shim": "registry:dt/es6-shim#0.31.2+20160602141504"

然后在打字稿文件的顶部添加引用路径

/// <reference path="typings/globals/es6-shim/index.d.ts" />`

或你的tsconfig.json。

这将删除任何打字稿错误。

Answer 6

如果您使用的是TypeScript 2，可以试试这个。

typings install npm:rx/ts/rx.all.d.ts --save --global