ERROR TypeError: Cannot read properties of undefined (reading 'ɵcmp')
at getComponentDef (core.mjs:2529:12)
at extractDirectiveDef (core.mjs:2418:12)
at core.mjs:2592:21
at Array.map ()
at core.mjs:2592:10
at createTView (core.mjs:11394:63)
at getOrCreateComponentTView (core.mjs:11343:28)
at createRootComponentView (core.mjs:15966:49)
at ComponentFactory.create (core.mjs:15845:39)
at ViewContainerRef2.createComponent (core.mjs:16265:47)
выдает такую ошибку когда пытаюсь зайти на роуты, которые имеют loadChildren. Т.е. при входе на login или signup такой проблемы нет, а когда захожу на home, то ошибка появляется. Пока не сделала path в tsconfig всё приложение работало полностью. Т.е. видимо не могу попасть на пути которые загружатся через lazy loading
вот мой tsconfig
/* To learn more about this file see:
https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"skipLibCheck": true,
"esModuleInterop": true,
"sourceMap": true,
"declaration": false,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "ES2022",
"module": "ES2022",
"useDefineForClassFields": false,
"lib": ["ES2022", "dom"],
"paths": {
"@/*": ["./src/*"],
"app/*": ["./src/app/*"],
"shared/*": ["./src/app/shared/*"],
"types/*": ["./src/app/types/*"],
"ngrx/*": ["./src/app/ngrx/*"],
"views/*": ["./src/app/views/*"]
}
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}
вот мой angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"frontend": {
"projectType": "application",
"schematics": {
"@schematics/angular:component": {
"style": "scss"
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:application",
"options": {
"outputPath": "dist/frontend",
"index": "src/index.html",
"browser": "src/main.ts",
"polyfills": ["zone.js"],
"tsConfig": "tsconfig.app.json",
"inlineStyleLanguage": "scss",
"assets": ["src/favicon.ico", "src/assets"],
"styles": ["src/assets/styles/styles.scss"],
"scripts": []
},
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "500kb",
"maximumError": "1mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "10kb"
}
],
"outputHashing": "all"
},
"development": {
"optimization": false,
"extractLicenses": false,
"sourceMap": true,
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.development.ts"
}
]
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"buildTarget": "frontend:build:production"
},
"development": {
"buildTarget": "frontend:build:development"
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"buildTarget": "frontend:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"polyfills": ["zone.js", "zone.js/testing"],
"tsConfig": "tsconfig.spec.json",
"inlineStyleLanguage": "scss",
"assets": ["src/favicon.ico", "src/assets"],
"styles": ["src/assets/styles/styles.scss"],
"scripts": []
}
},
"lint": {
"builder": "@angular-eslint/builder:lint",
"options": {
"lintFilePatterns": ["src/**/*.ts", "src/**/*.html"]
}
}
}
}
},
"cli": {
"schematicCollections": ["@angular-eslint/schematics"]
}
}
возможно я упустила какую-то информацию. Буду благодарна за помощь!
import { Routes } from '@angular/router';
import { LoginComponent } from 'views/auth';
import { SignupComponent } from 'views/auth';
import { LayoutComponent } from 'shared/components';
import { authForwardGuard } from 'app/core/auth/auth-forward.guard';
export const routes: Routes = [
{ path: '', title: 'Login in MyBookShelf', component: LoginComponent, canActivate: [authForwardGuard] },
// { path: 'login', title: 'Login in MyBookShelf', component: LoginComponent },
{
path: 'signup',
title: 'Signup in MyBookShelf',
component: SignupComponent,
canActivate: [authForwardGuard],
},
{
path: 'home',
component: LayoutComponent,
canActivate: [authForwardGuard],
children: [
{
path: '',
title: 'MyBookShelf',
pathMatch: 'full',
loadComponent: () => import('./views/user/home/home.component').then(m => m.HomeComponent),
},
{
path: 'show',
title: 'MyBookShelf',
loadComponent: () => import('./views/user/show-all/show-all.component').then(m => m.ShowAllComponent),
},
{
path: 'favorites',
title: 'MyBookShelf',
loadComponent: () => import('./views/user/favorites/favorites.component').then(m => m.FavoritesComponent),
},
{
path: 'book/:id',
title: 'MyBookShelf',
loadComponent: () => import('./views/user/detail-book/detail-book.component').then(m => m.DetailBookComponent),
},
{
path: 'upload',
title: 'MyBookShelf',
loadComponent: () => import('./views/user/upload/upload.component').then(m => m.UploadComponent),
},
{
path: 'search',
title: 'MyBookShelf',
loadComponent: () => import('./views/user/search/search.component').then(m => m.SearchComponent),
},
],
},