我用create-react-app创建了一个react应用。看起来Facebook在下面做了很多事情,比如webpack等等。但是,我想它可能也有一些限制。我试着按照this tutorial来加载谷歌MapAPI。当我调试代码时,我可以看到谷歌Map已经被成功引用了。x1c 0d1x。
但是,然后我点击播放,让应用程序完成运行。我得到了谷歌是没有定义的错误,从webpackhotdevclientiderjs和我的应用程序崩溃。
由于webpack编译文件的飞行,我假设它有麻烦加载谷歌Map通过https?
有什么想法吗?
5条答案
按热度按时间laximzn51#
正如用户指南中提到的,你需要显式地从
window
中读取任何全局变量,把它放在文件的顶部,它就会工作:我们之所以强制这样做是因为人们通常会误解局部变量、导入模块和全局变量之间的区别,因此我们希望在使用全局变量时始终在代码中明确这一点。
顺便说一句,这与Webpack或HTTPS无关。你看到这一点是因为我们使用了一个禁止未知全局变量的限制规则。
lstz6jyr2#
我认为当你从html中的脚本导入谷歌Map时,谷歌变量已经可用了。这个错误是由Eslint引起的,你可以尝试将下面的行添加到你的文件顶部以禁用ESlint
qgelzfjb3#
我有个更好的办法@Dan 's你可以这样做
或
如果
google
可用,则没有问题;如果不可用,则将临时分配空对象,直到加载脚本。如果
es-lint
抛出未定义的google错误,请更新eslint配置文件中的全局变量:或
对于特定的文件用例,在文件顶部定义如下
pqwbnv8z4#
您可以像这样使用
withGoogleMap
:6qftjkof5#
.eslintrc.json