v1.0.0: Error with Nuxt as host app

[David-Sellen]

Hi there!

I have a Nuxt application acting as host and to load remote client side Vue apps. Currently we're using @originjs/vite-plugin-federation which works OK but we would like to migrate to this library instead for other reasons.

I'm trying out @module-federation/[email protected] and it works well when i test it on my simple Vue SPA host but not when I'm trying to replace the OriginJS plugin in our Nuxt host application.

I get the following error in the browser and when I check the network traffic it does not load the RemoteEntyr.js.

Uncaught (in promise) Error: [ Federation Runtime ]: Please call init first
    at error2 (share.cjs.js:26:11)
    at Object.assert2 [as assert] (share.cjs.js:18:9)
    at loadRemote (index.cjs.js:2137:11)
    at myremote_app.js:3:32

The Vite settings in the Nuxt.config

...
vite: {
    plugins: [
      federation({
        name: "ssr-host",
        remotes: {
          myremote: {
            name: "myremote",
            shareScope: "myremote",
            entry: "/assets/remoteEntry.js",
            entryGlobalName: "myremote",
            type: "module",
          },
        },
        filename: "remoteEntry.js",
        runtimePlugins: ["./mfPlugin"], // From your example. only contains console.logs.
      })
    ],
    build: {
      target: "chrome89",
      rollupOptions: {
        output: {
          manualChunks(id) {
            if (id.indexOf("/@module-federation/runtime") > -1) {
              return "mfruntime";
            }
          },
        },
      },
    },

Might there be something in this library that does not support this approach or do you guys have something that I can try out to make it work?

[zhangHongEn]

The entry insertion code may not take into account the SSR application. I will fix it later.

[gioboa]

@David-Sellen thanks for your feedback. Can I ask you to add a Nuxt example please? You can add it next to the other ones. Appreciate

[zhangHongEn]

SSR requires me to complete manifest.json in advance, which is originally on the roadmap, This will take some time, I will finish it this week

 WARN  [ Federation Runtime ]: [ Federation Runtime ]: Failed to get manifestJson for @namespace/viteViteRemote. The manifest URL is http://localhost:5176/.vite/manifest.json. Please ensure that the manifestUrl is accessible.
          
 Error message:
          
 Error: [ Federation Runtime ]: http://localhost:5176/.vite/manifest.json is not a federation manifest

  
  Error message:
  
  Error: [ Federation Runtime ]: http://localhost:5176/.vite/manifest.json is not a federation manifest

[zhangHongEn]

The demo can be created, I will fix it this week

[David-Sellen]

That sounds great @zhangHongEn ! I created a small Nuxt example here: https://github.com/David-Sellen/vite/tree/73-error-with-nuxt-as-host-app @gioboa

[gioboa]

Thanks @David-Sellen 👏

[zhangHongEn]

I used the code of nuxt remote client in nuxt host server, and got this result as expected. Next, I need to find time to check how rust and webpack handle ssr.

This problem is more complicated and should take more time.

[gioboa]

Closed by #86

[zhangHongEn]

Sorry, nuxt is not yet completed. This issue needs to be reopened

---- Replied Message ---- | From | Giorgio @.> | | Date | 09/15/2024 19:47 | | To | module-federation/vite @.> | | Cc | zhn @.>, Mention @.> | | Subject | Re: [module-federation/vite] v1.0.0: Error with Nuxt as host app (Issue #73) |

Closed by #86

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you were mentioned.Message ID: @.***>

[husayt]

Also tried to get this working, but still not working. @zhangHongEn there is an asyncentry setting in nuxt you might find useful

https://nuxt.com/docs/guide/going-further/experimental-features#asyncentry

[zhangHongEn]

Also tried to get this working, but still not working. @zhangHongEn there is an asyncentry setting in nuxt you might find useful

https://nuxt.com/docs/guide/going-further/experimental-features#asyncentry

nuxt should wait for rolldown support

[gioboa]

Hey @David-Sellen , thanks for opening this issue, and for the examples. I'm closing this issue for now because we need to wait for rolldown support. Thanks.

[husayt]

@gioboa @zhangHongEn why do we need rolldown for this? let's keep the issue open, as nuxt support will pave the way for many others like Analog, solidstart as they also use nitro.

[husayt]

yesterday, I spent 5 hours trying to get that working and would love to see that happen, just for the sake of those hours 😅

[danya-rnd]

Hi! Why we have different errors?:D

I appreciate if Nuxt support will be available in the closest time. But I'm trying to use simple Vite app inside Nuxt.

[gioboa]

I tried to test Nuxt MFE with Vite remote and I added a console.log for the loading remote. It's not waiting for the promise.

[danya-rnd]

So do you have any ideas how to fix it at this moment? As I can see this issue is marked as "Blocked by another PR" but all PRs inside this thread are already merged.

Nuxt support is really must have:)

[zhangHongEn]

There are still some unresolved issues: https://github.com/nuxt/nuxt/issues/28911. The most important thing is that I really don’t have time recently. I will continue working on it when I have some free time, but it won’t be very soon.

[ScriptedAlchemy]

Rspack supports nuxt as well if you're in a bind.. vite may take some time if it's blocked by rolldown

[github-actions[bot]]

As there's been no activity for 30 days, this issue has been flagged as stale. If you'd like it to remain open, please add a comment within the next 7 days. Thank you.