Angular-仅在生产版本中接收错误

时间:2018-08-02 18:22:03

标签: angular typescript angular-cli angular6

我有一个在开发模式下按预期运行的Angular 6应用。但是,每当我在生产模式下运行它时,我都会收到至少两个无法查明的异常错误。第一个如下:

core.js:1545 ERROR TypeError: Bo(...).onMouseLeave is not a function
    at Object.handleEvent (client.component.ngf…ild-optimizer.js:82)
    at Object.handleEvent (core.js:9865)
    at Object.handleEvent (core.js:10409)
    at Gr (core.js:7325)
    at core.js:7770
    at HTMLElement.<anonymous> (platform-browser.js:1097)
    at e.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3645)
    at e.invokeTask (zone.js:420)
    at t.runTask (zone.js:188)

我在启用源地图的情况下构建它;但是,core.js中的1545行只是一个块注释的开头:

    function defaultErrorLogger(console) {
    var values = [];
    for (var _i = 1; _i < arguments.length; _i++) {
        values[_i - 1] = arguments[_i];
    }
    console.error.apply(console, __spread(values));
}

Line 1545 -> /**
 * @license
 * Copyright Google Inc. All Rights Reserved.
 *
 * Use of this source code is governed by an MIT-style license that can be
 * found in the LICENSE file at https://angular.io/license
 */
/**

这当然没有帮助。但是,尽管该错误令人讨厌,但该应用程序的这一部分功能正常。更令人担忧的是:

core.js:1545 ERROR Error: Uncaught (in promise): TypeError: Cannot read property 'subscribe' of undefined
TypeError: Cannot read property 'subscribe' of undefined
    at new e (dropdown.js:97)
    at fi (core.js:8921)
    at di (core.js:8796)
    at zi (core.js:10013)
    at ta (core.js:10329)
    at Xi (core.js:10248)
    at zi (core.js:10041)
    at Fi (core.js:9927)
    at Object.ia [as createRootView] (core.js:10442)
    at t.create (core.js:8271)
    at new e (dropdown.js:97)
    at fi (core.js:8921)
    at di (core.js:8796)
    at zi (core.js:10013)
    at ta (core.js:10329)
    at Xi (core.js:10248)
    at zi (core.js:10041)
    at Fi (core.js:9927)
    at Object.ia [as createRootView] (core.js:10442)
    at t.create (core.js:8271)
    at j (zone.js:814)
    at j (zone.js:771)
    at zone.js:873
    at e.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:3645)
    at e.invokeTask (zone.js:420)
    at t.runTask (zone.js:188)

再次指向core.js中的1545行。不是很有帮助。当我尝试以“管理员”身份登录我的应用程序时,发生第二个错误。如果我尝试直接通过地址栏(登录后)导航到管理路由,也会发生此错误。

login.component.ts

    @Component({
  selector: "app-login",
  templateUrl: "./login.component.html",
  styleUrls: ["./login.component.scss"]
})
export class LoginComponent implements OnInit {
  user: string;
  pass: string;
  loginFailed: boolean;
  isLoading: boolean;
  constructor(
    private authService: AuthService,
    private userService: UserService,
    private router: Router
  ) {
    this.user = "";
    this.pass = "";
    this.loginFailed = false;
    this.isLoading = false;
  }

  ngOnInit() {
    if (this.authService.isLoggedIn) {
      if (this.userService.getIsAdmin()) {
        this.router.navigate(["/admin"]);
      } else {
        this.router.navigate(["/client"]);
      }
    }
  }

  onSubmit() {
    this.isLoading = true;
    this.authService.login(this.user, this.pass).subscribe(
      res => {
        this.isLoading = false;
        if (this.userService.getIsAdmin()) {
          this.router.navigate(["/admin"]);
        } else {
          this.router.navigate(["/client"]);
        }
      },
      er => {
        this.loginFailed = true;
        this.isLoading = false;
      }
    );
  }
}

admin-routing.module.ts

    const routes: Routes = [
  {
    path: "admin",
    component: AdminComponent,
    canActivate: [AdminGuard],
    children: [
      {
        path: "",
        canActivateChild: [AdminGuard],
        children: [
          { path: "message/add", component: MessageAddComponent },
          { path: "message", component: MessageComponent },
          { path: "rev/add", component: RevAddComponent },
          { path: "rev", component: RevComponent },
          { path: "video/add", component: VideoAddComponent },
          { path: "video", component: VideoComponent },
          { path: "document/add", component: DocumentAddComponent },
          { path: "document", component: DocumentComponent },
          { path: "update", component: UpdateComponent },
          { path: "", component: AdminPanelComponent }
        ]
      }
    ]
  }
];

@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class AdminRoutingModule {}

admin-guard.service.ts

@Injectable()
export class AdminGuard implements CanActivate, CanActivateChild {
  constructor(
    private authService: AuthService,
    private userService: UserService,
    private router: Router
  ) {}
  canActivate() {
    console.log("AdminGuard#canActivate called");
    return this.checkAdmin();
  }

  canActivateChild() {
    return this.canActivate();
  }

  checkAdmin() {
    if (this.userService.getIsAdmin()) {
      return true;
    } else {
      this.router.navigate(["/login"]);
    }
  }
}

user.service.ts

@Injectable()
export class UserService {
  isAdmin = false;
  adminRoles = new Array<String>("ROLE_ADMIN", "ROLE_DL");

  constructor(private authService: AuthService) {}

  public getUserID(): number {
    return decode(this.authService.getToken()).userID;
  }

  public getStores(): Array<string> {
    return decode(this.authService.getToken()).stores;
  }

  public getUserName(): string {
    return decode(this.authService.getToken()).user_name;
  }

  public getIsAdmin(): boolean {
    const userRoles = decode(this.authService.getToken()).authorities;

    return (
      this.authService.isLoggedIn &&
      userRoles.filter(e => {
        return this.adminRoles.indexOf(e) > -1;
      }).length > 0
    );
  }
}

packages.json

  "name": "king-board",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^6.1.0",
    "@angular/common": "^6.1.0",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.0",
    "@angular/forms": "^6.1.0",
    "@angular/http": "^6.1.0",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/router": "^6.1.0",
    "@ng-bootstrap/ng-bootstrap": "^2.0.0",
    "angular-epic-spinners": "^1.0.9",
    "animate.css": "^3.7.0",
    "auth": "^1.0.1",
    "bootstrap": "^4.1.3",
    "core-js": "^2.5.4",
    "jwt-decode": "^2.2.0",
    "moment": "^2.22.2",
    "ngx-loading": "^1.0.14",
    "rxjs": "^6.2.2",
    "rxjs-compat": "^6.2.2",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.6.0",
    "@angular/cli": "~6.0.0",
    "@angular/compiler-cli": "^6.1.0",
    "@angular/language-service": "^6.1.0",
    "@types/jasmine": "~2.8.6",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~8.9.4",
    "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.7.2"
  }
}

我已经发布了我认为最有可能导致此问题的代码。不幸的是,很难说,因为该错误给了我很少的建议。我可以使用应用程序的客户端部分(尽管我收到第一个错误),并且该应用程序在开发模式下运行良好,它使用该应用程序的生产版本作为管理员根本无法正常工作。任何指针将不胜感激。

编辑

client.component.ts (partial)

ngOnInit() {
    this.route.paramMap
      .pipe(
        switchMap((params: ParamMap) => {
          this.storeID =
            params.get("storeID") === null
              ? Number(this.userService.getStores()[0])
              : +params.get("storeID");
          return of({});
        })
      )
      .subscribe();

    this.dateTime = new Date();

    this.updateData();

    this.timerID = window.setInterval(() => {
      this.checkUpdates();
    }, 1000 * 60 * 10);
  }

  ngOnDestroy() {
    window.clearInterval(this.timerID);
    window.clearInterval(this.modalTimerID);
    window.clearInterval(this.annivTimerID);
  }
  logout(ev: Event) {
    ev.preventDefault();
    this.authService.logout();
    this.router.navigate(["/login"]);
  }

  checkUpdates() {
    this.dateTime = new Date();
    if (this.authService.checkTokenExpired()) {
      this.authService.getRefreshToken();
    }
    this.updateService
      .checkUpdates(this.storeID)
      .subscribe(res => (this.updateNeeded = res));

    if (this.updateNeeded) {
      this.updateData();
    }
  }

  private updateData() {
    this.propertyService
      .getProperty(this.storeID)
      .subscribe(res => (this.storeNumber = res.propertyNumber));
    this.vidService.getActiveVideos().subscribe(res => (this.vidResults = res));
   // Code omitted for brevity
  }

  private checkPriorityMessages(msgs: Array<Message>) {
    if (msgs.filter(m => m.messageLevel === 1).length >= 1) {
      this.modalRef = this.modalService.open(PriorityModalComponent);
      this.modalRef.componentInstance.msg = this.msgResults.filter(
        m => m.messageLevel === 1
      )[0];
    } else if (this.modalRef !== undefined) {
      this.modalRef.close(0);
    }
  }

  private setEventTimer(msgs: Array<Message>) {
    if (msgs.filter(m => m.messageLevel === 3).length !== 0) {
      this.modalTimerID = window.setInterval(
        () => this.openEventModal(),
        1000 * 60 * 15
      );
    } else if (this.modalTimerID !== undefined) {
      window.clearInterval(this.modalTimerID);
    }

    if (msgs.filter(m => m.messageLevel === 4).length !== 0) {
      this.annivTimerID = window.setInterval(
        () => this.openAnnivModal(),
        1000 * 60 * 17
      );
    } else if (this.annivTimerID !== undefined) {
      window.clearInterval(this.annivTimerID);
    }
  }

// Code omitted for brevity

  }
}

0 个答案:

没有答案