Vitalii Litkevich
Vitalii Litkevich

Reputation: 11

In Angular 18 after migrating to the new build system I got an error: Cannot read properties of undefined (reading 'ɵcmp')

After migrating to the new build system. Using the command:

ng update @angular/cli --name use-application-builder

When I try to redirect on a route with lazyLoading module I got the error:

TypeError: Cannot read properties of undefined (reading 'ɵcmp')
    at getComponentDef (core.mjs:2462:10)
    at extractDirectiveDef (core.mjs:2355:10)
    at core.mjs:2524:96
    at Array.map (<anonymous>)
    at core.mjs:2524:85
    at createTView (core.mjs:11384:59)
    at getOrCreateComponentTView (core.mjs:11333:24)
    at addComponentLogic (core.mjs:12057:17)
    at instantiateAllDirectives (core.mjs:11867:5)
    at createDirectivesInstances (core.mjs:11298:3)

I expect the error gone

UPD: I localized the problem. Inside one of my lazy-loading routes I have a component with await import:

async showConfirmModal(option: MfaOption): Promise<void> {
    const isEnable = option.status === MfaStatus.INACTIVE;
    const module = await import('@portalLib/_components/mfa/mfa-modal/mfa-modal.component');
    this.modalService.showEntityModal<MfaModalComponent, Partial<MfaModalComponent>>({
      nzContent: module.MfaModalComponent,
      nzData: {
        option: option,
        userId: this.userId,
        email: this.email,
        isEnable: isEnable,
        successCallback: () => {
          option.status = isEnable ? MfaStatus.ACTIVE : MfaStatus.INACTIVE;
          this.cdRef.detectChanges();
        },
      },
    });
  }

Removing await import fixes the error.

Upvotes: 1

Views: 548

Answers (0)

Related Questions