Question

我遇到了打字稿和RxJs v5的问题。

请查看更新部分。

我做了yarn add @reactivex/rxjs（也是yarn add rxjs）并且我的index.ts做了import Rx from '@reactivex/rxjs';并收到了此错误：

此外，如果我运行node ./node_modules/.bin/tsc，我也会收到此错误error TS2307: Cannot find module '@reactivex/rxjs'.

更新

也在做

import { Observable } from 'rxjs/Observable'

抛出相同的错误

更新2

这似乎与TS本身有关，而不是与RxJS有关。

"compilerOptions": {
    "module": "commonjs",
    "allowJs": true,
    "outDir": "dist",
    "target": "es2015",
    "noImplicitAny": true,
    "noEmit": true,
    "strictNullChecks": true,
    "suppressExcessPropertyErrors": false,
    "suppressImplicitAnyIndexErrors": false,
    "allowUnreachableCode": false,
    "allowUnusedLabels": false,
    "noImplicitReturns": true,
    "noFallthroughCasesInSwitch": true,
    "lib": [
        "es2015",
        "dom"
    ]
}

使用此^配置似乎可以解决VSCode问题，但针对tsc运行src/index.ts无法正常工作

node_modules/rxjs/Observable.d.ts(69,60): error TS2693: 'Promise' only refers to a type, but is being used as a value here.

Answer 1

尝试在"moduleResolution": "node"内设置compileOptions，为TS指定模块解析策略。

npm install rxjs --save

并在你的手稿中

import { Observable } from 'rxjs/Rx';

为我修好了。

Answer 2

对我来说，我遇到以下错误：
错误TS2307：找不到模块'rxjs-compat / Observable'。

解决方案：而不是导入：

import { Observable } from 'rxjs/Observable';

使用：

import { Observable } from 'rxjs';

，然后可以用逗号分隔所有要导入的可观察对象，例如：

import { Observable, of } from 'rxjs';

Answer 3

对于RxJS 5，您应该使用：

import * as Rx from 'rxjs';

或仅导入库的特定部分：

import { Observable } from 'rxjs/Observable';

有关详细信息，请参阅：https://github.com/ReactiveX/rxjs/#installation-and-usage

Answer 4

我在Visual Studio 2017中的一个全新的“Hello World”项目中遇到了同样的问题，我已经执行了import { Observable } from 'rxjs/Observable' import * as http from 'http'; var port = process.env.port || 1337 http.createServer(function (req, res) { res.writeHead(200, { 'Content-Type': 'text/plain' }); res.end('Hello World\n'); }).listen(port);。

基本上只在我的module文件中有这个：

lib

根据为编译选项server.ts(1,28): error TS2307: Build:Cannot find module 'rxjs/Observable'.和node_modules\rxjs\Observable.d.ts(73,59): error TS2693: Build:'Promise' only refers to a type, but is being used as a value here.设置的值，这会产生错误：

"compilerOptions": {
    "module": "commonjs",
    "lib": [ "es2015" ]
  }

或：

 class RatesControllerTest < ActionDispatch::IntegrationTest

  # Login the user
  def setup
    logged_in_user = users(:one)
    login_with_user(logged_in_user)
  end

对我有用的编译选项的获胜组合是：

class ActiveSupport::TestCase
  # Setup all fixtures in test/fixtures/*.yml for all tests in alphabetical order.
  fixtures :all

  def setup_omniauth_mock(user)
    OmniAuth.config.test_mode = true
    omniauth_hash = { 'provider' => 'google',
                      'uid' => '12345',
                      'info' => {
                         'name' => "#{user.first_name} #{user.last_name}",
                          'email' => user.email,
                      },
                      'extra' => {'raw_info' =>
                                      { 'location' => 'San Francisco',
                                        'gravatar_id' => '123456789'
                                      }
                      }
    }

    OmniAuth.config.add_mock(:google, omniauth_hash)
  end

  # Add more helper methods to be used by all tests here...
  def login_with_user(user)
    setup_omniauth_mock(user)
    post sessions_path
  end

这使得两个错误都消失了。

Answer 5

使用以下语法：

import { Observable } from 'rxjs/Rx'

或者

import Rx from 'rxjs/Rx';
Rx.Observable.of(1,2,3)

或者

import { Observable} from 'rxjs/Observable';
import 'rxjs/add/observable/of';
import 'rxjs/add/operator/map';

Observable.of(1,2,3).map(x => x + '!!!'); // etc

所有这些例子都可以在网站上找到： http://reactivex.io/rxjs/manual/installation.html

Answer 6

This is a hard nut to crack: my fix

 in package.json  dependencies confirm this code exists:

     "rxjs": "^5.5.2",


In file /node_modules/@angular/core/src/application_ref.d.ts

//import { Observable } from 'rxjs/Observable';
// yeah, sure, I'm not supposed to, but I did and i worked
   import { Observable } from 'rxjs/Rx';


in file node_modules/rxjs/src/tsconfig.json

    {
      "compilerOptions": {
        "removeComments": false,
        "preserveConstEnums": true,
        "sourceMap": true,
        "declaration": true,
        "noImplicitAny": true,
        "noImplicitReturns": true,
        "noImplicitThis": true,
        "suppressImplicitAnyIndexErrors": true,
        "moduleResolution": "node",
        "target": "es6",
        "outDir": "dist/es6",
        "lib": [ "es2016.array.include" ]
      },
      "formatCodeOptions": {
        "indentSize": 2,
        "tabSize": 2
      },
      "bazelOptions": {
        "suppressTsconfigOverrideWarnings": true
      },
      "files": [
        "src/Rx.ts"
      ]
    }

for this ng --version

    Angular CLI: 1.6.7
    Node: 8.11.1
    OS: darwin x64
    Angular: 5.2.10
    ... animations, common, compiler, compiler-cli, core, forms
    ... http, language-service, platform-browser
    ... platform-browser-dynamic, router

    @angular/cli: 1.6.7
    @angular-devkit/build-optimizer: 0.0.42
    @angular-devkit/core: 0.0.29
    @angular-devkit/schematics: 0.2.0
    @ngtools/json-schema: 1.1.0
    @ngtools/webpack: 1.9.7
    @schematics/angular: 0.1.17
    typescript: 2.4.2
    webpack-dev-server: 2.11.2
    webpack: 3.10.0

Answer 7

让我们想象以下情况：

my-app
  |__ app.ts

app.ts文件包含根据martin's comment的import { Observable } from 'rxjs/Observable'。

我想将我的app.ts编译为app.js

第1步：npm install rxjs

my-app
  |__ app.ts
  |__ node_modules
          |__ rxjs
          |__ ...

步骤2：

无 tsconfig.json ：
- 步骤2-1：运行tsc --target es2015 --module commonjs app
使用和 tsconfig.json ：
- 步骤2-1：将tsconfig.json添加到my-app文件夹中。

my-app
  |__ app.ts
  |__ tsconfig.json
  |__ node_modules
          |__ rxjs
          |__ ...

- 步骤2-2：将以下配置设置为tsconfig.json文件：

{
  "compilerOptions": {
    "module": "commonjs",
    "target": "es2015"
  },
  "files": ["app.ts"]
}

- 第2-3步：运行tsc而不是 ~~tsc app~~

第3步：运行已编译的文件node app.js

Answer 8

当我使用 npm 安装 UUID 包时，我遇到了这个问题，然后我使用 yarn 安装并且对我来说效果很好。

RxJs和Typescript。 TS2307：找不到模块'@ reactivex / rxjs'

请查看更新部分。

更新

更新2

8 个答案: