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

micro-app:^1.0.0-rc.18

node:18.12.0

主应用:vite4+vue3

子应用:vite6+vue3

  1. [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)
        }
      }
    })
  ],
})
  1. [micro-app from runScript] app flowLtc: SyntaxError: Cannot use import statement outside a module
    解决办法:micro-app开子应用iframe沙箱
  2. 跨域
    解决办法:检查一下子应用有没有装micro-app,在子应用中配置跨域(看文档的说vite天然支持跨域,但是实际上还是配了server.cors:true
  3. 不报错但是也不渲染vite子应用
    解决办法:尝试关掉虚拟路由系统
    main.js
js 复制代码
import microApp from '@micro-zoe/micro-app'

// 在start中增加配置
microApp.start({
  'disable-memory-router': true, // 关闭虚拟路由
})
相关推荐
摸鱼仙人~29 分钟前
Vue中markdown-it基础使用教程
前端·javascript·vue.js
落魄江湖行36 分钟前
入门篇二:Nuxt 4路由自动生成:告别手动配置路由的日子
前端·vue.js·typescript·nuxt4
CQU_JIAKE1 小时前
4.4【Q】
java·前端·javascript
小陈工2 小时前
Python Web开发入门(十二):使用Flask-RESTful构建API——让后端开发更优雅
开发语言·前端·python·安全·oracle·flask·restful
木斯佳2 小时前
前端八股文面经大全:字节前端一面(2026-04-03)·面经深度解析
前端·面试题·面经
xiaotao1312 小时前
第八章:实战项目案例
前端·vue.js·vite·前端打包
GISer_Jing2 小时前
Electron 全场景调试实战指南
javascript·electron·状态模式
We་ct2 小时前
JS手撕:性能优化、渲染技巧与定时器实现
开发语言·前端·javascript·面试·性能优化·定时器·性能
taWSw5OjU2 小时前
vue对接海康摄像头-H5player
开发语言·前端·javascript
huwuhang2 小时前
跨平台电子书阅读器 | Readest最新版 安卓版+PC版全平台
android·前端·javascript