HTMLWebPackPlugin和外部GoogleMaps API脚本

问题描述

我正在使用HtmlWebpackPlugin用帕格生成我的html。加载googlemaps API时，我得到initMap is not defined的理解，因为我的捆绑包（定义了initMap）是在googlemaps脚本之后加载的。

我的HtmlWebpackPlugin设置：

    new HtmlWebpackPlugin({
        template: './src/pug/areas-covered.pug',filename: 'areas-covered.htm',inject: true
    }),

相关生成的html：

    <script async defer="defer" src="https://maps.googleapis.com/maps/api/js?key=xxxxx&callback=initMap">
    <script src="/assets/bundle.js">
</body>

删除async对我来说似乎并不妙。

我当前的解决方案是即时生成Googlemaps脚本标签，并在文档准备就绪时将其附加到正文中，并且效果很好：

var googlemaps = document.createElement('script');
googlemaps.setAttribute("src","https://maps.googleapis.com/maps/api/js?key=xxxxx&callback=initMap");
googlemaps.setAttribute("type","text/javascript");
document.body.appendChild(googlemaps);

我看不到传递外部脚本和指定脚本呈现顺序的任何选项。使用HtmlWebpackPlugin有更好的方法吗？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）