Vue 3 微前端与 Rails 应用中的 jQuery 冲突

Vue 3 micro frontend conflicts with jQuery in Rails app

提问人:Stickel 提问时间:7/22/2023 更新时间:7/22/2023 访问量:53

问:

我正在做的项目是一个 Rails 应用程序,其中 jQuery 运行在许多不同的部分/交互上。我正在 Vue 3 中实现微前端,使用修改后的 .hypernova-vue

起初,由于功能有限,一切似乎都可以正常工作。但是现在我正在添加更复杂的功能(模态、弹出框、深度嵌套组件),当我尝试加载页面时,我会得到一个错误列表。$(...).ready is not a function

当我在 Vue 中将该功能用于模态时,这种情况会一直发生。Teleport

删除标记似乎可以解决该错误,但它会破坏 UI。来自 Vue 组件的模态内容需要传送到页面上的另一个 div 才能正确显示。Teleport

jQuery Ruby-on-Rails vuejs3 vue-component hypernova

评论

0赞 ramin 7/22/2023
只需在jQuery工作原理中的所有JS中添加或添加<script src="https://code.jquery.com/jquery-3.7.0.min.js"> </script><Head><body>
1赞 Stickel 8/8/2023
jQuery是在大多数其他JS之前添加的,所以它是另一回事。我删除了一个 vueuse 可组合项,冲突似乎大部分都消失了。我假设这就是问题所在。<head>

答: 暂无答案