Question

我正在尝试在Heroku中进行有角度的申请。该应用程序可以完美构建并在我的笔记本电脑上本地运行。 npm install和npm start确实没有任何问题。

但是，当我将代码上传到heroku时。我得到以下信息：

远程：src / app / navigation / header / header.component.ts（2,30）中的错误：错误TS2307：找不到模块“ rxjs / subscription”。远程：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

package.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

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();
  }

}

Answer 2

我找到了解决方案。作为angular 7升级的一部分，rxjs也需要升级，并且还需要使用rxjs / subscription在应用程序的各个组件上进行升级。

来自从“ rxjs / subscription”导入{Subscription}；至从'rxjs'导入{订阅}； //取消订阅

Heroku中出现构建错误：错误TS2307：找不到模块'rxjs / subscription'

2 个答案: