micro-app icon indicating copy to clipboard operation
micro-app copied to clipboard

vite + vue3 ,百度地图有很多问题

Open hilanmiao opened this issue 1 year ago • 7 comments

1. 百度地图SDK放到基座中

基座应用:

   // index.html
    <script src="//api.map.baidu.com/api?type=webgl&v=1.0&ak=xxx"></script>

子应用

  // index.html
    <script>
        window.BMapGL = window.rawWindow.BMapGL
        window.BMAP_ANCHOR_TOP_LEFT = window.rawWindow.BMAP_ANCHOR_TOP_LEFT
        window.BMAP_STATUS_SUCCESS = window.rawWindow.BMAP_STATUS_SUCCESS
        // Tip: 子应用使用iframe方式,导致百度地图SDK中的instanceof检测结果会不符合预期,添加代码,
        // 且代码中的数组定义 [] 需要变为 new Array()
        window.Array = window.rawWindow.Array
    </script>

  // 代码
  // let myArr= []
  let myArr= new Array()

问题

因为使用的是vite,所以子应用只能用iframe模式,这导致了instance of Array 检测不符合预期。改变代码window.Array = window.rawWindow.Array ...... let myArr= new Array() 使用暂时没有问题。但我觉得这样可能有问题!

iframe模式下所有的 instance of xx 应该都有问题吧,应该如何处理呢?

2.百度地图SDK放到子应用中

主应用

  // 资源过滤
  microApp.start({
  excludeAssetFilter (assetUrl) {
    console.log(assetUrl)
    // 返回true则micro-app不会劫持处理当前文件
    const whiteWords = ['baidu.com', 'bdimg.com']
    return whiteWords.some(o => {
      return assetUrl.includes(o)
    })
  }
})

子应用

  // index.html
    <link rel="stylesheet" href="/bmap.css" >
    <script src="/bmap.min.js"></script>

问题

  1. 虽然报错 Uncaught TypeError: Failed to execute 'removeChild' on 'Node'...,但地图能用
  2. element-plus的diaolog无法正常使用,报错[Uncaught DOMException: Failed to execute 'removeChild' on 'Node': The node......

提问

这种第三方的资源,有没有完整的解决方案可以发一下吗?

hilanmiao avatar May 21 '24 10:05 hilanmiao