无法将Vue 2.7 Composition API与WebPack模块联合使用?

大家好!

我们有两个完全相同版本的应用程序(Vue 2.7.14),允许我们使用Composition API和 <script setup> 每个应用程序中的syntaxe。

我们设置了WebPack的ModuleFederation来在这两个应用程序之间建立一个桥梁。请注意,在每个应用程序上 <脚本设置> 方法非常有效,还有所有的Composition API钩子、方法和反应性。

现在,当我们试图将组件从项目B导入到项目a时,它可以全局工作,但在我们的控制台中,我们会出现以下错误:

[Vue warn]: inject() can only be used inside setup() or functional components.

奇怪的是: inject() 或 onMounted() 确实被称为内部 <脚本设置> 语法组件。它完全适用于这些项目中的其他组件。

看起来,通过ModuleFederation,设置并没有按应有的方式完成或类似的事情。

现在,以下是我们在 项目B :

new ModuleFederationPlugin({
   name: 'assets',
   filename: 'remoteEntry.js',
   library: { type: 'var', name: 'assets' },
   exposes: {
      './default/Favorites': './src/components/Favorites/views/Favourites',
   },
   shared: require('./package.json').dependencies
})

以下是我们如何在 项目A (使用项目B的组件):

new ModuleFederationPlugin({
   name: 'webapp',
   remotes: {
      assets: 'assets@http://localhost:9001/remoteEntry.js'
   }
})

最后,在我们的项目A中,在main.js文件中,我们这样注册这些组件:

Vue.component('Favorites', () => import('assets/default/Favorites'))

请注意,我们也这样尝试过:

Vue.component('Favorites', (resolve) => {
    import('assets/default/Favorites')
        .then((module) => resolve(module.default))
        .catch(() => false)
})

看起来用ModuleFederation创建的区块无法播放 script setup 正确地有人来帮我们解决这个非常烦人的问题吗?

我们非常确信,回到经典的Vue 2语法(经典 defineComponent )当然会让所有这些东西都很好地工作,但我们真的想跟上Composition API的步伐。

感谢所有能帮助我们的人。