Не может разрешить rxjs

Не удалось скомпилировать.

./src/app/hero.service.ts Модуль не найден: ошибка: не удается разрешить 'rxjs/Observable/of' in 'C:\Users\Admin\ angular\myheroes\src\app'
@ ./src/app/hero.service.ts 13:11-40 
@ ./src/app/app.module.ts 
@ ./src/main.ts 
@ multi webpack-dev-server/client?http://0.0.0.0:0 ./src/main.ts

мой код для hero.service.ts

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

@Injectable()
export class HeroService {

   constructor(private messageService: MessageService) { }

  getHeroes(): Observable<Hero[]>

  {
    // todo: send the message _after_fetching the heroes
    this.messageService.add('HeroService: fetched heroes');
    return of (HEROES);
  }
}

Ответ 1

Обычно у вас будет файл в вашем проекте, который называется rxjs-operators.ts, который импортирует части rxjs, которые вам нужны. Вы должны добавить эту строку в этот файл:

import 'rxjs/add/observable/of';

Также вычеркните эту строку:

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

Кроме того, импортируйте его прямо в свой модуль, посмотрите, работает ли он.

Ответ 2

Я получил эту ошибку из-за более старой версии rxjs и Angular 6 нуждается в последней версии rxjs.

Эта команда устанавливает последнюю версию, совместимую с Angular 6.

npm install --save rxjs-compat

Ответ 3

Как отметил Аравунд в своих комментариях, здесь важно дело. Вместо

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

попробовать...

import { of } from 'rxjs/observable/of';  // note the lower-cased 'o' on 'observable'

Ответ 4

Для тех из вас, кто жив по состоянию на 13 июля, правильный способ импорта модуля следующий:

import { Observable, of } from 'rxjs';

Я почти уверен, что из-за неправильных соглашений об именах доступа к заглавной букве O и к строчной букве o они включили его более всеобъемлющим образом.

Примечание: это кровоточащий край. ;)

Ответ 5

У меня такая же проблема, и я исправил проблему вроде следующего...

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

Где используется:

Observable.of(something)

Примечание. Важно всегда смотреть в npm rxjs, там вы можете найти документацию для текущей версии

Ответ 6

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';

Всегда убедитесь, что порядок ссылок на файлы должен быть в правильном порядке.

Ответ 7

У меня одинаковая ошибка как для angular/core, так и для rxjs. Вот так я исправляю проблему, явно говоря компилятору, где найти библиотеку:

"compilerOptions": {
  "paths": { 
    "@angular/*": ["../../node_modules/@angular/*"],
    "rxjs/*": ["../../node_modules/rxjs/*"]
  },
}

Ответ 8

В моем случае я получил ошибку из-за пути rxjs в webpack.config.js.

Я создал проект на диске C с помощью angular-cli и использовал ng eject для извлечения проекта и создания файла webpack.config.js.

На самом деле angular-cli вводит абсолютный путь для rxjs, как показано ниже:

"alias": {
      "rxjs/observable/of": "C:\\my_project_directory\\node_modules\\rxjs\\_esm5\\observable\\of.js"

...}

После ручного исправления относительного пути

"alias": {
      "rxjs/observable/of": "rxjs\\_esm5\\observable\\of.js"

.. }

Это начало работать.

Ответ 9

Ответы на этот вопрос противоречивы, вопрос хороший, но нет ответа, который действительно помогает.

Все это связано со сменой API с Rxjs, начиная с версии 6.0

Ответы здесь сбивают с толку из-за разных версий RxJ, вот в чем проблема. Ответ, начинающийся или заканчивающийся: "Это работает для меня", бесполезен, потому что это не ответ, это пример того, как он может работать, но у вас никогда нет полной истории, поэтому он бесполезен, потому что ничего не объясняет,

Все это очень хорошо объяснено здесь: https://academind.com/learn/javascript/rxjs-6-what-changed/ Если у вас есть 12 минут, это также хорошо объяснено на этом Youtube: https://www.youtube.com/смотреть? v = X9fdpGthrXA

Я знаю, что внешние ссылки в StackOverflow не ценятся, и на то есть веские причины, и хотя это не так уж много, но это довольно краткое объяснение короткого и полезного ответа.

Короче говоря, возобновляя, проблема связана с различиями между API Rxjs до версии 6.0 и начиная с RxJs 6.0. Если вы хотите сохранить код до 6.0 без изменений, вам следует установить rxjs-compat, это не так уж плохо

Лучше поменять код, и иметь в курсе и готовый к будущему.

Ответ 10

Угловой 7 и RxJS 6+

import { Observable } from 'rxjs'
import { tap, map, switchMap, catchError } from 'rxjs/operators'

Все операторы теперь находятся в rxjs/operators.

Ответ 11

Следующие шаги работают на меня.

1) Импорт оператора

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

2) Установите пакет rxjs-compat

$ npm i --save rxjs-compat