使用 Google Maps Javascript API 的好方法答案

【问题标题】：Using Google maps Javascript API the good way使用 Google Maps Javascript API 的好方法
【发布时间】：2017-02-13 17:00:10
【问题描述】：

我正在尝试遵循将我所有的 javascript 文件和 js 插件等编译成一个 javascript 文件的做法，然后将其包含到我的网站中。到目前为止，我一直在使用 gulp 和 npm 来实现这个目的，但是当我想包含的库不能那样工作时，我真的很挣扎。例如谷歌地图 API。那么，我该如何处理这种情况呢？我一直在问，我听说没有办法像你可以包含一个 php 文件那样“包含”一个 javascript 文件，但这是最终的答案吗？

我知道你可以在运行时使用 jQuery 包含其他文件，但是这样你就不会避免额外的 http 调用，记住理想的情况是调用一个包含你需要的所有 js 代码的 javascript 文件。

即使我在 javascript 中使用 require，所需的文件也必须具有正确的格式，并且我必须将其分配给变量 bla bla bla，但是当我包含像这样的脚本 <script type="text/javascript" src="myjsfile.js"></script> 时，所有内容都包含在我的范围正确。

我该如何解决这个问题？如果像 gulp 这样的 javascript 编译器复制我所有 javascript 源文件的内容并将它们粘贴到一个合并文件中，这会是一个好习惯吗？这与使用调用所有这些文件的方式不同吗？

好吧，我开始这个问题是因为我在使用 google maps api 时遇到了问题，但问题更普遍，所以如果你能帮助我，请也回答上述问题。无论如何，在谷歌地图 api 案例中，当我像这样包含它时，我可以很好地使用它

<script async defer
        src="https://maps.googleapis.com/maps/api/js?key=MYKEY&callback=Mycallback">
</script>

但是如何将其合并到包含库的缩小方式中？我尝试使用一些与谷歌地图 api 集成的 npm 库（例如 this），但我遇到了 CORS 问题，我认为这是预期的行为。

提前致谢！抱歉，如果有些事情听起来很愚蠢，我正在努力学习编码的好方法。

【问题讨论】：

Google Maps JavaScript API 必须从 Google 服务器加载，否则将无法按预期工作。你不应该把它合并到你的本地 js 文件中。

标签： javascript node.js google-maps

【解决方案1】：

不错的问题。

我不是专家，但有我的子问题/答案：

async 属性允许同时加载 html 和脚本。如果地图是网站的主要功能，我会将 <script> 放在加载 html 文件的顶部，因此它并不总是规则放置在 <body> 的底部。

【讨论】：