Vite Module Federation CORS error

[farhanmalhi-dbank]

Describe the bug

this is my host-app configuration

federation({
        name: 'host-app',
        filename: 'remoteEntry.js',
        remotes: {
          remote: 'http://localhost:3002/assets/remoteEntry.js'
        },
        shared: ['react', 'react-dom', '@din-global/tools-component-library']
      })

and this is my remote app configuration

plugins: [
     ...,
      federation({
        name: 'remote',
        filename: 'remoteEntry.js',
        exposes: {
          './Dashboard': './src/pages/dashboard/dashboard'
        },
        shared: ['react', 'react-dom', '@din-global/tools-component-library']
      })
    ],
    base: 'http://localhost:3002',
    server: {
      open: true,
      port: 3002,
      cors: true
    },
    

i can also see the file in browser at http://localhost:3002/assets/remoteEntry.js.

in my remote app terminal i can see the request but in browers it throws error

1. Access to script at 'http://localhost:3002/assets/remoteEntry.js' from origin 'http://localhost:3001' has been blocked by
   CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
2. GET http://localhost:3002/assets/remoteEntry.js net::ERR_FAILED 200 (OK)
3. Uncaught TypeError: Failed to fetch dynamically imported module: http://localhost:3002/assets/remoteEntry.js

Reproduction

i don't have public repo

Steps to reproduce

No response

System Info

System:
    OS: macOS 14.2.1
    CPU: (8) arm64 Apple M1 Pro
    Memory: 111.78 MB / 16.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 18.9.0 - ~/.nvm/versions/node/v18.9.0/bin/node
    Yarn: 1.22.19 - /opt/homebrew/bin/yarn
    npm: 8.19.1 - ~/.nvm/versions/node/v18.9.0/bin/npm
  Browsers:
    Chrome: 122.0.6261.94
    Safari: 17.2.1

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[devamitranjan]

federation({
name: 'host-app',
filename: 'remoteEntry.js',
remotes: {
remote: 'promise http://localhost:3002/assets/remoteEntry.js'
},
shared: ['react', 'react-dom', '@din-global/tools-component-library']
})

Have you tried promise import?

[farhanmalhi-dbank]

@devamitranjan
yes, it gave
__x00__virtual:federation:48 Uncaught TypeError: Failed to resolve module specifier 'promise http://localhost:3002/assets/remoteEntry.js'
at __x00__virtual:federation:48:37


[Pekarnya]

Same problem but i am using vue2

[Bhargav-1234567]

Is it solved ? I am getting the same error.