想问一下，未来是否考虑支持 vite

[zengxiaohui2019]

官方大大，非常感谢你们辛苦付出！ 想问一下，未来是否考虑支持 vite，这个需求很值得期待，对前端开发十分友好，如果官方不考虑支持，是否可以给出对接建议，期待ing...

[zhangjing007]

是啊 vite啥时间有参考的配置啊

[vlev1n]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

[snnaenu]

重要的是vite没有动态publicPath的支持， webpack_public_path

[django-d]

webpack_public_path 没有动态 就写死好了

[gongshun]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

这个依赖早就更新了吧。

由于 qiankun 是通过 eval 来执行这些 js 的内容，而 vite 里面 import/export 没有被转码， 所以直接接入会报错：不允许在非type=module 的 script 里面使用 import

也就是说 vite 构建的 js 内容必须在 type=module 的 script 里面。如果修改下 import-html-entry 源码，对 type=module 的 script 进行放行，那么会导致 qiankun 拿不到生命周期函数，因为 js 内容不是 qiankun 执行的。这里改下生命周期函数的获取方式，或许可以。

按照 #1268 (comment) 这个方法，可以实现生产环境接入，开发环境不行。

但是存在以下问题：

1. pubicPath 需要写死

2. 路由无法懒加载

   

3. 图片只会被打包成 base64，无论大小

demo 地址：https:/gongshun/qiankun-vue-demo/tree/feature/vite-child

猜想：其实 umd 打包不是必须的，如果直接在入口文件把生命周期函数挂在 window 上，也是可以拿到生命周期函数的，利用 @vitejs/plugin-legacy 进行转码，可以解决 type=module 的 script 的问题，但是还有其他的事情要做。不使用 umd 打包可以解决上面的问题2和3

@wangzhiwei1888

[haitaodesign]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

这个依赖早就更新了吧。

由于 qiankun 是通过 eval 来执行这些 js 的内容，而 vite 里面 import/export 没有被转码， 所以直接接入会报错：不允许在非type=module 的 script 里面使用 import

也就是说 vite 构建的 js 内容必须在 type=module 的 script 里面。如果修改下 import-html-entry 源码，对 type=module 的 script 进行放行，那么会导致 qiankun 拿不到生命周期函数，因为 js 内容不是 qiankun 执行的。这里改下生命周期函数的获取方式，或许可以。

按照 #1268 (comment) 这个方法，可以实现生产环境接入，开发环境不行。

但是存在以下问题：

1. pubicPath 需要写死
2. 路由无法懒加载
   
3. 图片只会被打包成 base64，无论大小

demo 地址：https:/gongshun/qiankun-vue-demo/tree/feature/vite-child

猜想：其实 umd 打包不是必须的，如果直接在入口文件把生命周期函数挂在 window 上，也是可以拿到生命周期函数的，利用 @vitejs/plugin-legacy 进行转码，可以解决 type=module 的 script 的问题，但是还有其他的事情要做。不使用 umd 打包可以解决上面的问题2和3

@wangzhiwei1888

这么搞代价有点大，没必要吧

[tengmaoqing]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

这个依赖早就更新了吧。
由于 qiankun 是通过 eval 来执行这些 js 的内容，而 vite 里面 import/export 没有被转码， 所以直接接入会报错：不允许在非type=module 的 script 里面使用 import

也就是说 vite 构建的 js 内容必须在 type=module 的 script 里面。如果修改下 import-html-entry 源码，对 type=module 的 script 进行放行，那么会导致 qiankun 拿不到生命周期函数，因为 js 内容不是 qiankun 执行的。这里改下生命周期函数的获取方式，或许可以。
按照 #1268 (comment) 这个方法，可以实现生产环境接入，开发环境不行。
但是存在以下问题：

1. pubicPath 需要写死
2. 路由无法懒加载
   
3. 图片只会被打包成 base64，无论大小

demo 地址：https:/gongshun/qiankun-vue-demo/tree/feature/vite-child
猜想：其实 umd 打包不是必须的，如果直接在入口文件把生命周期函数挂在 window 上，也是可以拿到生命周期函数的，利用 @vitejs/plugin-legacy 进行转码，可以解决 type=module 的 script 的问题，但是还有其他的事情要做。不使用 umd 打包可以解决上面的问题2和3
@wangzhiwei1888

这么搞代价有点大，没必要吧

写了一个基于es打包的 vite插件 vite-plugin-qiankun , 大家可以试试a

npm install vite-plugin-qiankun
配置简单、保留es特性

[jiangjunfeng98]

同问，后续官方大大会有计划支持吗？我们的项目在计划转vite了，但使用了qiankun作为微前端框架，该计划一直搁浅。求助！！！

不支持的话，又没有相关建议，万分感谢！！！

[tengmaoqing]

同问，后续官方大大会有计划支持吗？我们的项目在计划转vite了，但使用了qiankun作为微前端框架，该计划一直搁浅。求助！！！

不支持的话，又没有相关建议，万分感谢！！！

vite-plugin-qiankun 这个插件我在生产使用，目前没有遇到什么问题，欢迎使用。

[zhangjing007]

同问，后续官方大大会有计划支持吗？我们的项目在计划转vite了，但使用了qiankun作为微前端框架，该计划一直搁浅。求助！！！
不支持的话，又没有相关建议，万分感谢！！！

vite-plugin-qiankun 这个插件我在生产使用，目前没有遇到什么问题，欢迎使用。

请问有文档或者demo吗？

[tengmaoqing]

同问，后续官方大大会有计划支持吗？我们的项目在计划转vite了，但使用了qiankun作为微前端框架，该计划一直搁浅。求助！！！
不支持的话，又没有相关建议，万分感谢！！！

vite-plugin-qiankun 这个插件我在生产使用，目前没有遇到什么问题，欢迎使用。

请问有文档或者demo吗？

https:/tengmaoqing/vite-plugin-qiankun 这个

[jiangjunfeng98]

同问，后续官方大大会有计划支持吗？我们的项目在计划转vite了，但使用了qiankun作为微前端框架，该计划一直搁浅。求助！！！
不支持的话，又没有相关建议，万分感谢！！！

vite-plugin-qiankun 这个插件我在生产使用，目前没有遇到什么问题，欢迎使用。

我用了，不知道是不是我的配置有问题，开发环境不行。我也参考呢你的demo，但demo的vite项目是build后一起启动的，我们还是想要dev模式。
老哥，有解不？

[Hxgh]

同问，后续官方大大会有计划支持吗？我们的项目在计划转vite了，但使用了qiankun作为微前端框架，该计划一直搁浅。求助！！！
不支持的话，又没有相关建议，万分感谢！！！

vite-plugin-qiankun 这个插件我在生产使用，目前没有遇到什么问题，欢迎使用。

我用了，不知道是不是我的配置有问题，开发环境不行。我也参考呢你的demo，但demo的vite项目是build后一起启动的，我们还是想要dev模式。
老哥，有解不？

dev就是不支持，只有生产支持

[tengmaoqing]

同问，后续官方大大会有计划支持吗？我们的项目在计划转vite了，但使用了qiankun作为微前端框架，该计划一直搁浅。求助！！！
不支持的话，又没有相关建议，万分感谢！！！

vite-plugin-qiankun 这个插件我在生产使用，目前没有遇到什么问题，欢迎使用。

我用了，不知道是不是我的配置有问题，开发环境不行。我也参考呢你的demo，但demo的vite项目是build后一起启动的，我们还是想要dev模式。
老哥，有解不？

现在支持dev环境了，欢迎尝试

[kakajun]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

这个依赖早就更新了吧。
由于 qiankun 是通过 eval 来执行这些 js 的内容，而 vite 里面 import/export 没有被转码， 所以直接接入会报错：不允许在非type=module 的 script 里面使用 import

也就是说 vite 构建的 js 内容必须在 type=module 的 script 里面。如果修改下 import-html-entry 源码，对 type=module 的 script 进行放行，那么会导致 qiankun 拿不到生命周期函数，因为 js 内容不是 qiankun 执行的。这里改下生命周期函数的获取方式，或许可以。
按照 #1268 (comment) 这个方法，可以实现生产环境接入，开发环境不行。
但是存在以下问题：

1. pubicPath 需要写死
2. 路由无法懒加载
   
3. 图片只会被打包成 base64，无论大小

demo 地址：https:/gongshun/qiankun-vue-demo/tree/feature/vite-child
猜想：其实 umd 打包不是必须的，如果直接在入口文件把生命周期函数挂在 window 上，也是可以拿到生命周期函数的，利用 @vitejs/plugin-legacy 进行转码，可以解决 type=module 的 script 的问题，但是还有其他的事情要做。不使用 umd 打包可以解决上面的问题2和3
@wangzhiwei1888

这么搞代价有点大，没必要吧

写了一个基于es打包的 vite插件 vite-plugin-qiankun , 大家可以试试a

npm install vite-plugin-qiankun
配置简单、保留es特性

大佬这个能支持vue3么？

[humorHan]

@kuitos 组内也有接入vite的想法，想问下官方是否考虑支持？

[gongshun]

@kuitos 组内也有接入vite的想法，想问下官方是否考虑支持？

#1378 @humorHan

[zbeanbean]

目前的尝试，希望能有更好的解决方案。https://juejin.cn/post/7078958486041657374

[nongzhenli]

显然，并没有得到官方团队的正面答复丫~

[kongweigen]

过几天再来看看吧

[shunyue1320]

+1

[nvuhung]

+1

[zhoufanglu]

mark +1

[gitzhaochen]

mark +1

[lxlneo]

mark +1

[itLeeyw]

mark +1

[YornQiu]

乾坤的沙盒是通过with+eval实现的，但是esm中import必须放在顶部，这时沙盒就无法运行。
那么换一个方向，如果不使用沙盒，是不是就可以支持vite了，在同时只加载一个子应用的情况下这么做似乎没有什么问题。
又或者，有没有办法实现一个适用于esm的沙盒？

[LeifJG]

+1

[yugasun]

Refer to my project: https:/yugasun/micro-frontend-starter

[kakajun]

不回复就是不支持呗，已经有更好的方式支持了 发自我的企业微信  

…

----------回复的邮件信息---------- ***@***.***> 于2022年7月9日(周六) 上午10:27写道: 为啥官方不回复这个问题呀？ — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you commented.Message ID: ***@***.***>

[evemike]

+1 mark

[gaorubin1990]

vite-plugin-qiankun 暂时没发现啥问题

[AYang518989]

vite-plugin-qiankun 暂时没发现啥问题

我自己本地的小demo可以运行，但是到项目子应用的生命周期从头走到尾，直接销毁了，请问有什么方法解决吗？

[lishaobos]

其实换个思路也不是没办法，比较简单，我自己写了个 https:/lishaobos/vite-plugin-legacy-qiankun, 公司已经跑了好一段时间了。

[lishaobos]

可以讨论交流还有没有更好的办法

[MechaGirls]

同问，官方大佬们啥时可以适配vite

[TengFeiHao]

同问，官方大佬们啥时可以适配vite

[sky124380729]

mark

[SericXu]

mark

[russellmars]

mark

[lishaobos]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

2年过去了，也没见他们快起来呀。 又是一个kpi项目？哈哈哈，国内大厂... 啧啧啧

咱们是使用者，这么说也不好，有想法也可以给他们提 pr。

[mxismean]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

2年过去了，也没见他们快起来呀。 又是一个kpi项目？哈哈哈，国内大厂... 啧啧啧

咱们是使用者，这么说也不好，有想法也可以给他们提 pr。

害，你说的对

[lishaobos]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

2年过去了，也没见他们快起来呀。 又是一个kpi项目？哈哈哈，国内大厂... 啧啧啧

咱们是使用者，这么说也不好，有想法也可以给他们提 pr。

害，你说的对

楼上不是有个老兄开发了个 vite 插件么，我自己也因为沙箱问题自己也开发了一个，你可以都试试，看能暂时解决你的问题么，大家都还是想把这弄好。

[mxismean]

个人觉得不支持vite主要是因为vite的script标签中有type="module"，而qiankun的依赖之一import-html-entry不支持这个属性，导致整个框架不支持vite。但新版的import-html-entry已经支持type="module"（参见此处），只是qiankun的依赖还没更新，相信快了！

2年过去了，也没见他们快起来呀。 又是一个kpi项目？哈哈哈，国内大厂... 啧啧啧

咱们是使用者，这么说也不好，有想法也可以给他们提 pr。

害，你说的对

楼上不是有个老兄开发了个 vite 插件么，我自己也因为沙箱问题自己也开发了一个，你可以都试试，看能暂时解决你的问题么，大家都还是想把这弄好。

好的 ，感谢

[lydhl]

裂开了 针灸无解呗

[cjlhll]

其实换个思路也不是没办法，比较简单，我自己写了个 https:/lishaobos/vite-plugin-legacy-qiankun, 公司已经跑了好一段时间了。

element 的icon字体文件404怎么办啊，webpack有__webpack_public_path__可以解决。

[Mboulianne]

+1

[gjmhandsome]

其实换个思路也不是没办法，比较简单，我自己写了个 https:/lishaobos/vite-plugin-legacy-qiankun, 公司已经跑了好一段时间了。

element 的icon字体文件404怎么办啊，webpack有__webpack_public_path__可以解决。

写个vite plugin，在transform的时候手动加上public_path

[alexwjj]

现在支持的咋样了，感觉原理冲突，有点难搞啊

[longshihui]

沙盒的原理是要拦截script脚本的加载，通过闭包的方式做沙盒。
es module原生加载是不支持拦截的，除非浏览器出新标准，否则我感觉想es module沙盒化，几乎是不可能

[lishaobos]

沙盒的原理是要拦截script脚本的加载，通过闭包的方式做沙盒。 es module原生加载是不支持拦截的，除非浏览器出新标准，否则我感觉想es module沙盒化，几乎是不可能

生产环境配合 legacy 还是没问题的，dev 就是代理到qiankun 的 window

[zidanDirk]

mark

[alexwjj]

qiankun3.0已经支持了，等等把： #1378