javascript - Hvordan importere npm-pakker uten TypeScript-definisjon slik at IDE fortsatt gir intellisense?

Jeg bruker en npm-pakke som ikke har typedefinisjon for TypeScript. For å være nøyaktig, bruker jeg react-google-maps-biblioteket.

Etter deres eksempel importerte jeg følgende komponenter fra pakken:

import {GoogleMapLoader, GoogleMap, Marker} from "react-google-maps";

Men TypeScript gir en feil under kompilering som:

error TS2305: Module '"react-google-maps"' has no exported member 'GoogleMapLoader'.

Så, min raske løsning på dette er en deklarasjon av modulen med dens medlemmer av typen "any":

declare module "react-google-maps" {
    export var GoogleMapLoader:any;
}

Nå er imidlertid problemet at IDE-en min (WebStorm) ikke gir intellisense lenger. GoogleMapLoader blir ikke engang gjenkjent som en React-komponent, noe jeg tror ville blitt gjenkjent (i det minste metodene og egenskapene uten typene) hvis jeg brukte Babel.

Hvordan kan jeg importere npm-pakker uten typedefinisjoner slik at de kan bli løst av TypeScript-kompilatoren og likevel ikke hindrer IDE-en fra å gi intellisense?

Svar #1

Du må erklære hva du bruker i stedet for bare å bruke any.

For eksempel:

declare module "react-google-maps" {
    interface GoogleMapLoaderProps {
        ....
    }

    interface GoogleMapLoaderState {
        ....
    }

    class GoogleMapLoader extends React.Component<GoogleMapLoaderProps, GoogleMapLoaderState> { }
}

Du kan starte med bare det du bruker og trenger at IDE-en støtter, og gradvis legge til flere ting.
Du kan sjekke Skrive deklarasjonsfiler for mer informasjon om hvordan du gjør det.

Relaterte artikler