Element ref was specified as a string (map) but no owner was set

Hi, I'm getting an error when I attempt to load the Map component.

Uncaught Error: Element ref was specified as a string (map) but no owner was set. This could happen for one of the following reasons:

  1. You may be adding a ref to a functional component
  2. You may be adding a ref to a component that was not created inside a component's render method
  3. You have multiple copies of React loaded
    See https://fb.me/react-refs-must-have-owner for more information.
    at invariant (VM56119 invariant.js:42)
    at coerceRef (VM56126 react-dom.development.js:7350)
    at createChild (VM56126 react-dom.development.js:7555)
    at reconcileChildrenArray (VM56126 react-dom.development.js:7805)
    at reconcileChildFibers (VM56126 react-dom.development.js:8121)
    at reconcileChildrenAtExpirationTime (VM56126 react-dom.development.js:8240)
    at reconcileChildren (VM56126 react-dom.development.js:8231)
    at updateHostComponent (VM56126 react-dom.development.js:8539)
    at beginWork (VM56126 react-dom.development.js:8986)
    at performUnitOfWork (VM56126 react-dom.development.js:11814)

Below is my dependency list. I attempted to degrade react to ^15.0.0, but other packages broke.

"dependencies": {
"chart.js": "^2.7.2",
"google-maps-react": "^2.0.0",
"highcharts": "^6.1.0",
"moment": "^2.22.1",
"prop-types": "^15.6.1",
"react": "^16.3.2",
"react-chartjs-2": "^2.7.0",
"react-dates": "^16.6.1",
"react-dom": "^16.3.2",
"react-highcharts": "^16.0.2",
"react-router-dom": "^4.2.2",
"react-vis": "^1.9.2"
},
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.4",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.24.1",
"css-loader": "^0.28.11",
"eslint": "^4.19.1",
"eslint-plugin-react": "^7.7.0",
"file-loader": "^1.1.11",
"html-webpack-plugin": "^3.2.0",
"node-sass": "^4.8.3",
"sass-loader": "^7.0.1",
"style-loader": "^0.21.0",
"url-loader": "^1.0.1",
"webpack": "^4.6.0",
"webpack-cli": "^2.0.14",
"webpack-dev-server": "^3.1.3"
}

and here's my Map component:

import React, { Component } from 'react';
import { GoogleApiWrapper, Map as GoogleMap } from 'google-maps-react';

class Map extends Component {
    render() {
        const style = {
            width: '100vw',
            height: '100vh'
        };
        return (
            <div style={style}>
                <GoogleMap 
                    google={this.props.google}
                />
            </div>
        );
    }
}

export default GoogleApiWrapper({
    apiKey: "MY_API_KEY"
})(Map);