Skip to content

vite微应用js加载两次 #1049

@xiaofanchuan159

Description

@xiaofanchuan159

使用vite打包的微应用js资源被加载两次
vue3+vite+vue router ,使用路由懒加载后,微应用的js资源被加载两次

如何复现
给出详细的复现步骤
1、环境准备vue3+vite+vue router 创建项目
2、修改路由配置,改为路由懒加载
mport { createRouter, createWebHistory } from 'vue-router'
import { usemicroState } from '../views/micro/libs/microStore'
const routes = [
{
path: '/',
name: 'Home',
component: () => import('../views/Home.vue')
},
{
path: '/about',
name: 'About',
component: () => import('../views/About.vue')
},
{
path: '/contact',
name: 'Contact',
component: () => import('../views/Contact.vue')
},
{
path: '/profile',
name: 'Profile',
component: () => import('../views/Profile.vue')
}
]
3、打包项目,查看打包后的index.html文件

<title>微应用</title> <script type="module" crossorigin src="/assets/index-CAvf3DnO.js"></script>
4、带有modulepreload的js文件会被重复加载,如下 **错误截图** 如果有可以将截图带上 Image

最小复现仓库或者地址

  1. 主应用使用examples\main-vue
  2. 微应用使用:https://github.com/xiaofanchuan159/vite-micro.git
    5、问题解析,排查源码发现packages\wujie-core\src\effect.ts的201行-205行的判断使js的link被直接插入,从而导致多了一次加载。已经做了解决方案,正在提交代码合并,注意查收。

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions