Protocol http is not support by the default ESM loader

[justin-slijkhuis]

My goal is to import components from website A in website B so I can use the same components in both websites. For technical details:

• Both websites use the Qwik framework which uses Vite with EMS and TypeScript
• I use Node 22.3.20

I have a single component exposed in website A. When I navigate to 'http://localhost:5173/dist/assets/remoteEntry.js', then I can see the code for the component there. In website B, when I use fetch('http://localhost:5173/dist/assets/remoteEntry.js'), then it also shows this code.

Yet when I use the code below in my vite.config.ts of website B, then it keeps giving me the error below the code snippet. Some people suggested it was caused by Windows, but moving both websites to Linux Docker containers did not help. Others suggested an outdated Node version, but I am already using the latest version of Node. Downgrading to a different version also does not help.

plugins: [qwikCity(), qwikVite(), tsconfigPaths(), federation({
    name: "b",
    remotes: {
        a: 'http://localhost:5173/dist/assets/remoteEntry.js'
    },
})],

Error when evaluating SSR module /app/cms/src/routes/index.tsx: failed to import "http://localhost:5173/dist/assets/remoteEntry.js"
Error [ERR_UNSUPPORTED_ESM_URL_SCHEME]: Only URLs with a scheme in: file and data are supported by the default ESM loader. Received protocol 'http:'

After doing more research, I found that the import function of ESM does not support importing HTTP or HTTPS URLs. So vite-plugin-federation isn't able to import the remoteEntry.js page. Anyone know what to do in this situation?

Before anyone asks: I am very positive that website B can reach remoteEntry.js of website A, even with my Docker setup.