reactjs - react 谷歌地图 : Cannot find namespace 'google'

Question

我正在尝试使用此库 “react-google-maps” 在我的应用程序中显示谷歌地图。在按照他们的 github 页面上的教程进行操作后，我在第一次运行时遇到了这个错误(这是一个 create-react-app + typescript 应用程序):

我有点迷路了。以前有人用过这个库吗？这是我的代码:

import * as React from 'react';
import { GoogleMap, Marker, withGoogleMap, withScriptjs } from 'react-google-maps';
import { compose, withProps } from 'recompose';

const TerrMap: React.StatelessComponent<{
    isMarkerShown: boolean
}> = compose(
    withProps({
        googleMapURL: "https://maps.googleapis.com/maps/api/js?key=__my_api_key__&v=3.exp&libraries=geometry,drawing,places",
        loadingElement: <div style={{ height: `100%` }} />,
        containerElement: <div style={{ height: `400px` }} />,
        mapElement: <div style={{ height: `100%` }} />,
      }),
      withScriptjs,
      withGoogleMap
)( (props: any) => {

    return (
        <GoogleMap
            defaultZoom={8}
            defaultCenter={{ lat: -34.397, lng: 150.644 }}
        >
            {props.isMarkerShown && <Marker position={{ lat: -34.397, lng: 150.644 }} />}
        </GoogleMap>
    );
} ) as any;

Answer 1

如果还没有回答。以下是解决此问题的方法。

1. 添加这两个输入 "@types/googlemaps" 和 "@types/markerclustererplus"
2. 确保将这些类型包含在项目中。您可以采用不同的方式，但最简单的方法是像这样在 tsconfig.json 文件中添加这两种类型。

-

{
    "compilerOptions":{
        ...,
        "types":[
            ...
            "googlemaps",
            "markerclustererplus"
        ] 
    }
}

这应该可以解决您的问题。