После угловой версии 15–16 код миграции перестал компилироваться с прикрепленными ошибками.
После того как я обновил свою кодовую базу с Angular 15 до Angular 16, она перестала компилироваться. Вот шаги, которые я пробовал:
- Обновлены все зависимости: когда я запускаю
ng update
, я не получаю никаких ожидающих обновлений. - Очистил кэш: удалил
node_modules
папка иpackage_lock.json
файл и сделал чистый .
npm install
работает успешно, но при компиляции я всегда получаю ошибку в одном из моих основных модулей:
Error: src/app/tasks/tasks.module.ts:20:5 - error NG6002: 'AppModuleShared' does not appear to be an NgModule class.
AppModuleShared
После обновления до Angular 16 никаких изменений в коде этого модуля не произошло. В процессе обновления не было никаких изменений ни в каком коде, ни в Tasks.module.ts, ни в AppModuleShared.
Вот фрагмент кода, в котором возникает ошибка:
машинопись
@NgModule({
declarations: [
InboxComponent,
TaskStatusPipe
],
imports: [
CommonModule,
RouterModule.forChild([
{ path: 'tasks', component: InboxComponent }
]),
AppModuleShared // Getting error at this line
]
})
export class TasksModule { }
вот общий модуль приложения
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { MatLegacyAutocompleteModule as MatAutocompleteModule } from '@angular/material/legacy-autocomplete';
import { MatBadgeModule } from '@angular/material/badge';
import { MatLegacyButtonModule as MatButtonModule } from '@angular/material/legacy-button';
import { MatLegacyCardModule as MatCardModule } from '@angular/material/legacy-card';
import { MatLegacyCheckboxModule as MatCheckboxModule } from '@angular/material/legacy-checkbox';
import { MatNativeDateModule } from '@angular/material/core';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatLegacyDialogModule as MatDialogModule } from '@angular/material/legacy-dialog';
import { MatDividerModule } from '@angular/material/divider';
import { MatLegacyFormFieldModule as MatFormFieldModule } from '@angular/material/legacy-form-field';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatIconModule } from '@angular/material/icon';
import { MatLegacyInputModule as MatInputModule } from '@angular/material/legacy-input';
import { MatLegacyListModule as MatListModule } from '@angular/material/legacy-list';
import { MatLegacyMenuModule as MatMenuModule } from '@angular/material/legacy-menu';
import { MatLegacyPaginatorModule as MatPaginatorModule } from '@angular/material/legacy-paginator';
import { MatLegacyProgressBarModule as MatProgressBarModule } from '@angular/material/legacy-progress-bar';
import { MatLegacyProgressSpinnerModule as MatProgressSpinnerModule } from '@angular/material/legacy-progress-spinner';
import { MatLegacyRadioModule as MatRadioModule } from '@angular/material/legacy-radio';
import { MatLegacySelectModule as MatSelectModule } from '@angular/material/legacy-select';
import { MatSidenavModule } from '@angular/material/sidenav';
import { MatLegacySlideToggleModule as MatSlideToggleModule } from '@angular/material/legacy-slide-toggle';
import { MatLegacySnackBarModule as MatSnackBarModule } from '@angular/material/legacy-snack-bar';
import { MatSortModule } from '@angular/material/sort';
import { MatStepperModule } from '@angular/material/stepper';
import { MatLegacyTableModule as MatTableModule } from '@angular/material/legacy-table';
import { MatLegacyTabsModule as MatTabsModule } from '@angular/material/legacy-tabs';
import { MatToolbarModule } from '@angular/material/toolbar';
import { MatLegacyTooltipModule as MatTooltipModule } from '@angular/material/legacy-tooltip';
import {MatExpansionModule} from '@angular/material/expansion';
import { MatTreeModule } from '@angular/material/tree';
import { LayoutModule } from '@angular/cdk/layout';
import { FlexLayoutModule } from '@angular/flex-layout';
import { ProductTileComponent } from './shared/product-tile/product-tile.component';
import { ProductAliasTileComponent } from './shared/product-alias-tile/product-alias-tile.component';
import { DragulaModule } from 'ng2-dragula';
import { NgxsModule } from '@ngxs/store';
import { TourMatMenuModule } from 'ngx-tour-md-menu';
import { HttpClient, HttpClientModule } from '@angular/common/http';
import { NguCarouselModule } from '@ngu/carousel';
import { NgSelectModule } from '@ng-select/ng-select';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatDatetimepickerModule, MatNativeDatetimeModule, MAT_DATETIME_FORMATS } from '@mat-datetimepicker/core';
import { MAT_DATE_FORMATS } from '@angular/material/core';
import { CommonModule } from '@angular/common';
import { NgxMaterialTimepickerModule } from 'ngx-material-timepicker';
import { CmpState } from '../states/CmpState';
import { FavouritesState } from '../states/FavouritesState';
import { UserState } from '../states/UserState';
import { PrefsState } from '../states/PrefsState';
import { OrderForState } from '../states/OrderForState';
import { BasketState } from '../states/BasketState';
import { PreferencesComponent } from './shared/preferences/preferences.component';
import { ProfileComponent } from './shared/profile/profile.component';
import { BasketComponent } from './shared/basket/basket.component';
import { BreadcrumbComponent } from './shared/breadcrumb/breadcrumb.component';
import { HomeSwitchAddressComponent } from './home/home-switch-address/home-switch-address.component';
import { HomeSwitchUserComponent } from './home/home-switch-user/home-switch-user.component';
import { OverlayModule } from '@angular/cdk/overlay';
import { ToastrModule } from 'ngx-toastr';
import { ShoppingListComponent } from './shared/shopping-list/shopping-list.component';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { CustomDateAdapter } from './product/questionnaire/form-elements/date-time/custom-date-adapter';
import { DateAdapter } from '@angular/material/core';
import { PreviousRouteService } from './previous-route.service';
import { RulesService } from 'src/services/Questionnaire/RulesService';
import { QuestionnaireService } from 'src/services/Questionnaire/QuestionnaireService';
import { CategoriesState } from '../states/CategoriesState';
import { LookupService } from 'src/services/Questionnaire/LookupService';
import { HelperService } from 'src/services/Helper/HelperService';
import { ExcelOrdersHelperService } from 'src/services/Helper/ExcelOrdersHelperService';
import { DecodeHtml, EncodeUriPipe, SafePipe } from 'src/pipes';
import { OrderForPaneComponent } from './shared/order-for-pane/order-for-pane.component';
import { OrderReviewState } from 'src/states/order-review.state';
import { GetProfilePicPipe } from 'src/pipes/get-profile-pic.pipe';
import { FormatDatePipe } from 'src/pipes/format-date.pipe';
import { configuration } from 'src/domain';
import { FilterPipe } from 'src/pipes/filter.pipe';
import { LuceneExplanationBottomSheetComponent } from './shared/lucene-explanation-bottom-sheet/lucene-explanation-bottom-sheet.component';
import { SupportTabComponent } from './shared/support-tab/support-tab.component';
import { IconsService } from 'src/services/Icons/IconsService';
import { MatBottomSheetModule } from '@angular/material/bottom-sheet';
import { HelpCentreState } from 'src/states/help-centre.state';
import { OrdersService } from 'src/services';
import { ProductTileNarrowComponent } from './shared/product-tile-narrow/product-tile-narrow.component';
import { InfoModalComponent } from './shared/info-modal/info-modal.component';
import { ApiUserProfileComponent } from './shared/api-user-profile/api-user-profile.component';
import { TemplateGroupComponent } from './shared/template-group/template-group.component';
import { TemplateCreatorComponent } from './shared/template-creator/template-creator.component';
import { CreateTemplateDialogComponent } from './shared/create-template-dialog/create-template-dialog.component';
import { TemplatesState } from 'src/states/TemplatesState';
import { TemplateCreatorWrapperComponent } from './shared/template-creator-wrapper/template-creator-wrapper.component';
import { TemplateFromOrderCreatorComponent } from './shared/template-from-order-creator/template-from-order-creator.component';
import { ReorderState } from 'src/states/ReorderState';
import { CopyTemplateWrapperComponent } from './shared/copy-template-wrapper/copy-template-wrapper-dialog.component';
import { SharedTemplateGroupComponent } from './shared/shared-template-group/shared-template-group.component';
const LOCALE_DATETIMEPICKER_FORMATS = {
parse: { dateInput: { day: '2-digit', hour: '2-digit', minute: '2-digit', month: '2-digit', year: 'numeric' } },
display: {
dateInput: { year: 'numeric', month: '2-digit', day: '2-digit', customDate: 'true' },
monthInput: { month: 'long' },
datetimeInput: 'input',
timeInput: { hour: '2-digit', minute: '2-digit' },
monthYearLabel: { year: 'numeric', month: 'short' },
dateA11yLabel: { year: 'numeric', month: 'long', day: 'numeric' },
monthYearA11yLabel: { year: 'numeric', month: 'long' },
popupHeaderDateLabel: { weekday: 'short', month: 'short', day: '2-digit' }
}
};
@NgModule({
declarations: [
ProductTileComponent,
ProductAliasTileComponent,
ProductTileNarrowComponent,
PreferencesComponent,
ProfileComponent,
ApiUserProfileComponent,
DecodeHtml,
BasketComponent,
SafePipe,
EncodeUriPipe,
OrderForPaneComponent,
GetProfilePicPipe,
FormatDatePipe,
FilterPipe,
LuceneExplanationBottomSheetComponent,
SupportTabComponent,
TemplateGroupComponent,
TemplateCreatorComponent,
TemplateCreatorWrapperComponent,
CreateTemplateDialogComponent,
TemplateFromOrderCreatorComponent,
CopyTemplateWrapperComponent,
SharedTemplateGroupComponent
],
imports: [
NgxsModule.forRoot([
CmpState,
OrderReviewState,
TemplatesState,
ReorderState,
], {selectorOptions: { suppressErrors: false }, developmentMode: false}),
CommonModule,
MatSlideToggleModule,
ToastrModule.forRoot(),
FormsModule,
OverlayModule,
ReactiveFormsModule,
MatToolbarModule,
MatFormFieldModule,
MatIconModule,
MatInputModule,
LayoutModule,
DragulaModule.forRoot(),
TourMatMenuModule.forRoot(),
HttpClientModule,
NguCarouselModule,
MatMenuModule,
MatProgressBarModule,
MatAutocompleteModule,
MatSortModule,
RouterModule,
TranslateModule.forRoot({
loader: {
provide: TranslateLoader,
useFactory: function (httpClient: HttpClient) {
return new TranslateHttpLoader(httpClient, '/assets/i18n/', `-lang.json?version=${configuration.version}`);
},
deps: [HttpClient]
}
})
],
exports: [
CommonModule,
FormsModule,
MatSortModule,
TranslateModule,
RouterModule,
BreadcrumbComponent,
SafePipe,
EncodeUriPipe,
OrderForPaneComponent,
GetProfilePicPipe,
FormatDatePipe,
FilterPipe,
SharedTemplateGroupComponent
],
providers: [
QuestionnaireState,
IconsService,
LookupService,
MatNativeDateModule,
CustomDateAdapter,
PreviousRouteService,
{ provide: DateAdapter, useClass: CustomDateAdapter },
{ provide: MAT_DATETIME_FORMATS, useValue: LOCALE_DATETIMEPICKER_FORMATS },
{ provide: MAT_DATE_FORMATS, useValue: LOCALE_DATETIMEPICKER_FORMATS }
]
})
export class AppModuleShared {
}