ошибка сборки в Heroku: ошибка TS2307: не удается найти модуль 'rxjs / subscription'

Question

Я пытаюсь запустить угловое приложение в Heroku. Приложение отлично собирается и работает локально на моем ноутбуке. Установка npm и запуск npm производятся без проблем.

однако, когда я загружаю код в heroku. Я получаю следующее:

remote: ОШИБКА в src / app / navigation / header / header.component.ts (2,30): ошибка TS2307: Не удается найти модуль 'rxjs / subscription'. remote: src / app / navigation / sidenav-list / sidenav-list.component.ts (2,30): ошибка TS2307: не удается найти модуль 'rxjs / subscription'.

Может ли кто-нибудь помочь с шагами, чтобы решить эту проблему? Я уже пробовал "https://devcenter.heroku.com/articles/troubleshooting-node-deploys#keep-reading" без особого успеха.

https://devcenter.heroku.com/articles/troubleshooting-node-deploys#keep-reading

содержимое пакета. Jason

{
  "name": "kca",
  "version": "0.0.0",
  "engines": {
    "node": "10.13.0",
    "npm": "6.4.1"
  },
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.0.0-beta.2",
    "@agm/snazzy-info-window": "^1.0.0-beta.3",
    "@angular/animations": "^6.1.10",
    "@angular/cdk": "^7.2.0",
    "@angular/common": "^6.1.0",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.0",
    "@angular/flex-layout": "^6.0.0-beta.18",
    "@angular/forms": "^6.1.0",
    "@angular/http": "^6.1.0",
    "@angular/material": "^7.2.0",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/router": "^6.1.0",
    "@ngrx/store": "^7.2.0",
    "bootstrap": "^4.1.3",
    "core-js": "^2.5.4",
    "cors": "^2.8.4",
    "font-awesome": "^4.7.0",
    "hammerjs": "^2.0.8",
    "jquery": "^3.3.1",
    "ngx-papaparse": "^2.1.3",
    "papaparse": "^4.4.0",
    "rxjs": "^6.3.2",
    "rxjs-compat": "^6.2.0",
    "snazzy-info-window": "^1.1.1",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.3",
    "@angular/cli": "^6.2.2",
    "@angular/compiler-cli": "^6.1.0",
    "@angular/language-service": "^6.0.2",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "angular-ide": "^0.9.41",
    "codelyzer": "~4.2.1",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~1.7.1",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~1.4.2",
    "karma-jasmine": "~1.1.1",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.3.0",
    "ts-node": "~5.0.1",
    "tslint": "~5.9.1",
    "typescript": "^2.9.2"
  }
}

Answer 1

Я нашел решение.Как часть обновления 7 angular, rxjs также нуждался в обновлении, и наряду с этим включал в себя различные компоненты приложения, используя rxjs / subscription.

от импорта {Subscription} из 'rxjs / subscription';импортировать {подписку} из 'rxjs';// исключаем подписку

Answer 2

import { Component, OnInit, OnDestroy, EventEmitter, Output} from '@angular/core';
import { Subscription } from 'rxjs/subscription';
import { Router } from '@angular/router';

import { AuthService } from '../../auth/auth.service';
import { TokenStorageService } from '../../auth/token-storage.service';

@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.css']
})
export class HeaderComponent implements OnInit {
  @Output () sidenavToggle = new EventEmitter<void>();
  isAuth = false;
  // if we are subscribing to an observable we need to un-subscribe once we finish using it
  // this will eliminate memory leak problems. authSubscription will help on that.
  authSubscription: Subscription;

  constructor(private authService: AuthService, private tokenStorage: TokenStorageService, private router: Router ) { 
  }

  ngOnInit() {
      // subscribe to changes in authorisation and ensure we store the subscriptions to eliminate it later
      this.authSubscription = this.authService.authChange.subscribe(authStatus => {
          this.isAuth = authStatus;
      })
  }

  onLogout() {
      this.authService.logout();
      this.tokenStorage.signOut();
      this.router.navigate(['login'])
  }

  ngOnDestroy () {
      // un-subscribe from all subscriptions when destroying this component. 
      this.authSubscription.unsubscribe();
  }

  // Create an event that we will listen to in the main app.component.html
  // This will help us toggle and untoggle the sidenav pannel
  // sidenaToggle is our event emitter and making output we make it listenable
  // from outside the component. NOTE this pattern is used quite commongly
  onToggleSidenav () {
    this.sidenavToggle.emit();
  }

}