googlemaps / googlemaps/js-samples

Cannot find namespace 'google'.

Open
#1,209 4 comments 2 reactions 1 assignee Assigned to @amuramoto View on GitHub
Dominant language
TypeScript
Stars
805
Forks
836
PR merge metrics
No merged PRs in 30d

Description

### Operating system

macOS 12.04

### Browser Version

Firefox 100.0.2

### How severe is the bug?

moderate

### Bug description

This bug is about the code excerpt from https://developers.google.com/maps/documentation/javascript/react-map#add-map

Using the given code block (see below), will lead to
`Cannot find namespace 'google'.` and `Property 'google' does not exist on type 'Window & typeof globalThis'`. The imports linked in this repository does also not solve the problem.

```
const ref = React.useRef(null);
const [map, setMap] = React.useState();

React.useEffect(() => {
if (ref.current && !map) {
setMap(new window.google.maps.Map(ref.current, {}));
}
}, [ref, map]);
```

### Steps to reproduce

Follow the steps on [`https://developers.google.com/maps/documentation/javascript/react-map#typescript`](https://developers.google.com/maps/documentation/javascript/react-map)

### Console log output

```sh
Uncaught TypeError: window.google is undefined
```

### Source code as suggested by the guide

```
import React from 'react';
import { Wrapper, Status } from '@googlemaps/react-wrapper';

export const Map: React.FC<{}> = () => {
const ref = React.useRef(null);
const [map, setMap] = React.useState();

React.useEffect(() => {
if (ref.current && !map) {
setMap(new window.google.maps.Map(ref.current, {}));
}
}, [ref, map]);

return

;
};

export const MyMap: React.FC = () => {
return (
<>


);
};
```

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.