Angular Google Maps构建Capacitor应用后地图瓦片加载失败但标记正常的问题求助

各位开发者朋友，我碰到一个棘手的问题，想请教下大家的经验：

我基于Angular 17，使用Angular Google Maps库开发了地图组件，开发模式下一切运行正常——之前因为无法使用标记，特意去Google Cloud Platform创建了mapId，标记的问题也顺利解决了。

但当我用Capacitor构建生产版本后，出现了奇怪的状况：地图瓦片完全加载不出来，也没法和地图进行交互（比如拖拽、缩放操作都失效），可诡异的是，标记和它们对应的信息窗口却能正常工作。我尝试在生产环境做调试，但完全看不到任何报错信息，实在不知道从哪里入手排查。

以下是我放在index.html中的动态库导入脚本：

(g=>{var h,a,k,p="The Google Maps JavaScript API",c="google",l="importLibrary",q="__ib__",m=document,b=window;b=b[c]||(b[c]={});var d=b.maps||(b.maps={}),r=new Set,e=new URLSearchParams,u=()=>h||(h=new Promise(async(f,n)=>{await (a=m.createElement("script"));e.set("libraries",[...r]+"");for(k in g)e.set(k.replace(/[A-Z]/g,t=>"_"+t[0].toLowerCase()),g[k]);e.set("callback",c+".maps."+q);d[q]=f;a.src=`https://maps.googleapis.com/maps/api/js?`+e;d[l]=((...s)=>r.add(s[0])&&u().then(()=>d[l](...s)))}))})({
  key: "YOUR_API_KEY",
  mapId: "YOUR_MAP_ID"
});

有没有人遇到过类似的情况？或者能给我一些排查的方向？谢谢大家！

备注：内容来源于stack exchange，提问作者Alex