angular - Grensesnittet 'HTMLIonIconElement' kan ikke samtidig utvide typene 'IonIcon' og 'HTMLStencilElement'


Jeg har nettopp oppgradert min Angular Ionic-app til å bruke Angular v13 fra Angular 12 ved å kjøre ng update. Oppdateringen var vellykket, men nå klarer jeg ikke å kjøre appen med følgende feil

[ng] Error: node_modules/ionicons/dist/types/components.d.ts:66:15 - error TS2320: Interface 'HTMLIonIconElement' cannot simultaneously extend types 'IonIc
on' and 'HTMLStencilElement'.
[ng]   Named property 'ariaHidden' of types 'IonIcon' and 'HTMLStencilElement' are not identical.
[ng]
[ng] 66     interface HTMLIonIconElement extends Components.IonIcon, HTMLStencilElement {
[ng]                  ~~~~~~~~~~~~~~~~~~
[ng]
[ng]
[ng] Error: node_modules/ionicons/dist/types/components.d.ts:66:15 - error TS2320: Interface 'HTMLIonIconElement' cannot simultaneously extend types 'IonIc
on' and 'HTMLStencilElement'.
[ng]   Named property 'ariaLabel' of types 'IonIcon' and 'HTMLStencilElement' are not identical.
[ng]
[ng] 66     interface HTMLIonIconElement extends Components.IonIcon, HTMLStencilElement {
[ng]                  ~~~~~~~~~~~~~~~~~~
[ng]
[ng]
[ng] Error: node_modules/typescript/lib/lib.dom.d.ts:4632:101 - error TS2344: Type 'HTMLElementTagNameMap[K]' does not satisfy the constraint 'Element'.
[ng]   Type 'HTMLElement | HTMLMetaElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | ... 151 more ... | HTMLMarqueeElement' is not assigna
ble to type 'Element'.
[ng]     Type 'HTMLIonIconElement' is not assignable to type 'Element'.
[ng]       Property 'ariaHidden' is optional in type 'HTMLIonIconElement' but required in type 'Element'.
[ng]
[ng] 4632     getElementsByTagName<K extends keyof HTMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementTagNameMap[K]>;
[ng]                                                                                                          ~~~~~~~~~~~~~~~~~~~~~~~~
[ng]
[ng]
[ng] Error: node_modules/typescript/lib/lib.dom.d.ts:4953:101 - error TS2344: Type 'HTMLElementTagNameMap[K]' does not satisfy the constraint 'Element'.
[ng]   Type 'HTMLElement | HTMLMetaElement | HTMLAnchorElement | HTMLAreaElement | HTMLAudioElement | ... 151 more ... | HTMLMarqueeElement' is not assigna
ble to type 'Element'.
[ng]
[ng] 4953     getElementsByTagName<K extends keyof HTMLElementTagNameMap>(qualifiedName: K): HTMLCollectionOf<HTMLElementTagNameMap[K]>;
[ng]        

Problemet er at alle filene det klages over, ligger i node_modules-katalogen. Hvordan kan jeg løse dette?

Svar #1

For meg la jeg bare til "skipLibCheck": true, i tsconfig.json, se koden nedenfor:

Svar #2

Det ser ut til at ng update oppdaterte TypeScript-versjonen til 4.4, men Ionic ion-icon ser ut til å være inkompatibel med denne versjonen av TypeScript.

Den nåværende løsningen jeg brukte var å gå tilbake til TypeScript-versjon 4.3.5

Hvordan utføre denne nedgraderingen:

oppdater din package.json -> erstatt: "typescript": "~4.4.4" med "typescript": "~4.3.5"

kjør deretter -> npm install

Hvis noen har mer informasjon om den grunnleggende årsaken til denne inkompatibiliteten og en annen måte å løse dette på, er jeg veldig interessert siden jeg veldig gjerne ønsker å oppgradere til TypeScript 4.4.

Relaterte artikler