Почему не работает google map Api?

Question

[georgedubinsky8888]

Пробовал сделать google maps в react проекте с помощью Api по этому короткому видео:
https://www.youtube.com/watch?v=rWiYi9v8JFU&t=
автор которого в свою очередь руководствовался этим:
https://www.npmjs.com/package/google-maps-react

Но на экране карты не отображаются, просто пустая страница.
В консоли вот такое:


Код App.js:

import React from 'react';
import logo from './logo.svg';
import './App.css';
import {Map, InfoWindow, Marker, GoogleApiWrapper} from 'google-maps-react';


class App extends React.Component() {
render() {
  return (
    <div className="App">
      <header className="App-header">
        <img src={logo} className="App-logo" alt="logo" />
        <p>
          Edit <code>src/App.js</code> and save to reload.
        </p>
        <a className="App-link" href="https://reactjs.org" target="_blank" rel="noopener noreferrer">
          Learn React
        </a>
      </header>

      <Map google={this.props.google} zoom={14}>
 
        <Marker onClick={this.onMarkerClick}
                name={'Current location'} />
 
        <InfoWindow onClose={this.onInfoWindowClose}>
            <div>
              <h1>{this.state.selectedPlace.name}</h1>
            </div>
        </InfoWindow>
      </Map>
      
      
    </div>
  );
 }
}

export default GoogleApiWrapper({
  apiKey: ("тут я написал API key")
})(App)

Answer 1

[vadimMalovaniy]

Проблема не с google map Api. У тебя webpack проект не может собрать из за отсутствующего модуля babel-зкуыуе.
npm install делал?

Comments

[georgedubinsky8888]

webpack не использовал
устанавливал:
npm install --save google-maps-react
больше ничего не устанавливал

[vadimMalovaniy]

georgedubinsky8888, а как ты проект запускаешь без вебпака? Создай приложение с помощью create-react-app и перенеси туда код свой. Не забудь npm install --save google-maps-react. Приложение запускаеться с помощью npm start.