У меня проблема с загрузкой компонента при запуске приложения. Это не лениво загружен (как вы можете видеть из файла маршрута приложения), обновление с v8 до v9 прошло нормально. На v8 он отлично работает, но после обновления до v9 и включения ivy в true, маршрутизация не работает. Если ivy установлен на false, он снова работает, даже в v9! Это странно.
Обычно, когда пользователь входит в '.com, он перенаправляет на / questions или пользователь вводит /questions.com, он работает, когда ivy имеет значение false.
Вот некоторые сведения о версиях:
"@angular/animations": "~9.0.7",
"@angular/common": "~9.0.7",
"@angular/compiler": "~9.0.7",
"@angular/core": "~9.0.7",
"@angular/forms": "~9.0.7",
"@angular/platform-browser": "~9.0.7",
"@angular/platform-browser-dynamic": "~9.0.7",
"@angular/platform-server": "~9.0.7",
"@angular/router": "~9.0.7",
"@nguniversal/express-engine": "^8.2.6",
"@nguniversal/module-map-ngfactory-loader": "8.1.1",
"bootstrap": "^4.4.1",
"chart.js": "^2.9.3",
"core-js": "^2.6.11",
"express": "^4.15.2",
"ng2-charts": "^2.3.0",
"rxjs": "~6.5.4",
"tslib": "^1.10.0",
"zone.js": "~0.10.2"
}
Это мой конфигурационный файл:
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "esnext",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es2015",
"resolveJsonModule": true,
"allowSyntheticDefaultImports": true,
"esModuleInterop": true,
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2018",
"dom"
]
},
"angularCompilerOptions": {
"enableIvy": false,
"fullTemplateTypeCheck": false,
"strictTemplates": false
}
}
Файл маршрутизации моего приложения:
import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './core/home/home.component';
import { NgModule } from '@angular/core';
const routes: Routes = [
{ path: 'info', component: HomeComponent },
{ path: '', redirectTo: '/questions', pathMatch: 'full'},
{ path: 'users', loadChildren: () => import('./users/users.module').then(m => m.UsersModule) },
{ path: 'about', loadChildren: () => import('./aboutus/aboutus.module').then(m => m.AboutUsModule) },
{ path: 'Frequently-Asked-Questions', loadChildren: () => import('./faq/faq.module').then(m => m.FaqModule) },
{ path: 'legal', loadChildren: () => import('./legal/legal.module').then(m => m.LegalModule) },
{ path: 'help', loadChildren: () => import('./help/help.module').then(m => m.HelpModule) },
{ path: 'categories', loadChildren: () => import('./categories/categories.module').then(m => m.CategoriesModule) },
];
@NgModule({
imports: [RouterModule.forRoot(routes, { scrollPositionRestoration: 'enabled' })
],
exports: [RouterModule]
})
export class AppRoutingModule { }
Модуль моего приложения:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule, ErrorHandler } from '@angular/core';
import { HttpClientModule } from '@angular/common/http'
import { AppComponent } from './app.component';
import { CoreModule } from './core/core.module';
import { AuthErrorHandler } from './auth/autherrorhandler.service';
import { LoaderModule } from './core/loader/loader.module';
import { UrlSerializer } from '@angular/router';
import CustomUrlSerializer from './shared/CustomEncoder.service';
import { SeoSocialSharedService } from './shared/SeoSocialSharedService';
import { ServerErrorModule } from './core/server-error/server-error.module';
import { AuthModule } from './auth/auth.module';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { GoogleAnalyticsEventsService } from './shared/googleAnalyticsEventsService.service';
import { QuestionsModule } from './questions/questions.module';
const customUrlSerializer = new CustomUrlSerializer();
const CustomUrlSerializerProvider = {
provide: UrlSerializer,
useValue: customUrlSerializer
};
@NgModule({
declarations: [
AppComponent,
],
imports: [
BrowserModule.withServerTransition({ appId: 'serverApp' }),
HttpClientModule,
BrowserAnimationsModule,
LoaderModule,
CoreModule,
QuestionsModule,
AuthModule,
ServerErrorModule,
],
providers: [
SeoSocialSharedService,
{ provide: ErrorHandler, useClass: AuthErrorHandler },
CustomUrlSerializerProvider,
GoogleAnalyticsEventsService
],
bootstrap: [AppComponent]
})
export class AppModule {}
Файл маршрутизации «И вопросы»:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { AuthGuard } from '../auth/auth-guard.service';
import { QuestionsComponent } from './questions.component';
import { QuestionAskComponent } from './question-ask/question-ask.component';
import { QuestionDetailComponent } from './question-detail/question-detail.component';
const questionRoutes: Routes = [
{ path: 'questions', component: QuestionsComponent },
{ path: ':questions/:id/:title', component: QuestionDetailComponent },
{ path: ':questions/new', component: QuestionAskComponent, canActivate: [AuthGuard] },
]
@NgModule({
imports: [
RouterModule.forChild(questionRoutes)
],
exports: [RouterModule]
})
export class QuestionsRoutingModule {
}
Так что все остается прежним, на всякий случай, если включить ivy в true, маршрут вопроса (загрузка компонента) не за работой. Другие маршруты работают нормально. Может быть, я что-то упустил, придется изменить в v9 ???
Если у кого-то есть идеи, они очень приветствуются! Спасибо.