如何在沒有TypeScript定義的情況下導入npm包，以便IDE仍提供intellisense？

Question

我使用的是npm包，它沒有TypeScript的類型定義。 確切地說，我正在使用react-google-maps庫。

按照他們的示例，我從包中導入了以下組件：

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

但是，TypeScript在編譯期間會拋出一個錯誤：

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

所以，我對此的快速解決方案是模塊的聲明，其成員類型為“any”：

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

現在，問題是我的IDE（WebStorm）不再提供intellisense了。 GoogleMapLoader甚至不被認為是反應組件，我相信如果我使用Babel，它會被認可（至少是沒有打字的方法和屬性）。

如何導入沒有類型定義的npm包，以便由TypeScript編譯器解析，但是不妨礙IDE提供智能感知？

Answer 1

您需要聲明您正在使用的內容而不是僅使用any 。

例如：

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

    interface GoogleMapLoaderState {
        ....
    }

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

您可以從您正在使用的內容開始，需要IDE支持，並慢慢添加內容。
您可以查看寫入聲明文件以獲取有關如何執行此操作的更多信息。