reactjs - hur man lägger till typdeklaration i ett React-Typescript-projekt med CRA

Jag har skapat ett React TypeScript-projekt med CRA med kommandot yarn create react-app my-app --typescript

nu har jag en modul foo installerad som inte har någon typning varken som standard eller i definitelytyped-förrådet.

d.v.s. i en komponent, jag har

import {bar} from 'foo';

vilket ger fel Typfel: Kunde inte hitta en deklarationsfil för modul 'foo'. '/*/node_modules/foo/dist/entry.js' har implicit typen 'any'.

Jag skapade foo.d.ts i types-mappen i projektets rot som

declare module 'foo'{ import * as React from 'react' }

bara för att ha foo som typen any men ändå få samma fel. det verkar som att oavsett vilken kompilator (webpack, annan transpiler) inte hittar deklarationen i types-mappen

hur kan jag lägga till en anpassad typdeklaration till projektet?

Svar #1

Här är ett verkligt användningsfallsexempel. Jag lyckades integrera kendo-ui-core i CRA+Typescript.

Problemet var att det inte finns några typsnitt för kendo-ui-core, nämligen att typsnitten har ett annat namn: @types/kendo-ui

Typescript klagade över att det saknades typdefinitioner

För att lösa problemet, skapa en fil som heter kendo-ui-core.d.ts i din /src-katalog med följande innehåll:

// src/kendo-ui-core.d.ts
declare module 'kendo-ui-core' {
  import * as KendoTypings from '@types/kendo-ui';
  export = KendoTypings;
}

Svar #2

Det här fungerar:

/* create src/CustomTypes.ts */

namespace MyCustomType {
  export type foo = number;
}

export default MyCustomType;

använd så här:

import MyCustomType from "src/CustomTypes";

const num: MyCustomType.foo = 123;