micro-app vite4接入vite6 遇到的问题

困顿小狗2025-01-12 15:25

micro-app:^1.0.0-rc.18

node:18.12.0

主应用:vite4+vue3

子应用:vite6+vue3

[Vue warn]: Component is missing template or render function
原因:没有正确识别<micro-app></micro-app>
解决办法:
vite.config.js

js 复制代码

export default defineConfig({
  plugins: [
    vue({
      template: {
        compilerOptions: {
          isCustomElement: tag => /^micro-app/.test(tag)
        }
      }
    })
  ],
})

[micro-app from runScript] app flowLtc: SyntaxError: Cannot use import statement outside a module
解决办法:micro-app开子应用iframe沙箱
跨域
解决办法:检查一下子应用有没有装micro-app,在子应用中配置跨域(看文档的说vite天然支持跨域,但是实际上还是配了server.cors:true
不报错但是也不渲染vite子应用
解决办法:尝试关掉虚拟路由系统
main.js

js 复制代码

import microApp from '@micro-zoe/micro-app'

// 在start中增加配置
microApp.start({
  'disable-memory-router': true, // 关闭虚拟路由
})