Update Angular 18 issue

I'm migrating an Ionic Angular Project to Angular 18. After I updated the packages I got the following Errors:

Error:

1. If 'ion-searchbar' is an Angular component, then verify that it is part of this module.
2. If 'ion-searchbar' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

4 <ion-searchbar (ionInput)="searchData($event)" color="light" debounce="500"></ion-searchbar>

src/app/modals/searchable-adress-modal-component/searchable-adress-modal-component.component.ts:7:18
7 templateUrl: './searchable-adress-modal-component.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component SearchableAdressModalComponentComponent.


Error: src/app/modals/searchable-adress-modal-component/searchable-adress-modal-component.component.html:5:9 - error NG8001: 'ion-spinner' is not a known element:
1. If 'ion-spinner' is an Angular component, then verify that it is part of this module.
2. If 'ion-spinner' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.

5 <ion-spinner *ngIf="loadDataSpinner" class="w-full justify-center mt-3 mb-3" color="primary"
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
6 name="lines-sharp"></ion-spinner>
src/app/modals/searchable-adress-modal-component/searchable-adress-modal-component.component.ts:7:18
7 templateUrl: './searchable-adress-modal-component.component.html',
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Error occurs in the template of component SearchableAdressModalComponentComponent.


Ionic Module is imported in App.Module.ts

@NgModule({
declarations: [AppComponent, ...],
imports: [ IonicModule.forRoot({
scrollPadding: true,
scrollAssist: true
}),...],
providers: []
providers: [
{
provide: RouteReuseStrategy,
useClass: IonicRouteStrategy
},
{
provide: ErrorHandler,
// Attach the Sentry ErrorHandler
useValue: SentryAngular.createErrorHandler()
},
{
provide: SentryAngular.TraceService,
deps: [Router]
},
{
provide: APP_INITIALIZER,
useFactory: () => () => {},
deps: [TraceService],
multi: true,
},
],
bootstrap: [AppComponent],
schemas: [
CUSTOM_ELEMENTS_SCHEMA
]
}


So my modules are not importing correctly. I have Angular version 18.2.7 installed with ionic/angular v8.3.2 I'm struggling with that for hours. I tried to reinstall a couple of times, and took a look at the changeling but no hints for that.

Continue reading...