https://github.com/module-federation/external-remotes-plugin

Dynamically set remote origins at runtime within hosts
https://github.com/module-federation/external-remotes-plugin

federation module module-federation module-federation-examples webpack webpack-plugin

Last synced: 3 months ago
JSON representation

Dynamically set remote origins at runtime within hosts

• Host: GitHub
• URL: https://github.com/module-federation/external-remotes-plugin
• Owner: module-federation
• License: mit
• Created: 2021-05-19T22:10:59.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-07-27T00:48:37.000Z (over 3 years ago)
• Last Synced: 2024-10-29T14:22:23.512Z (3 months ago)
• Topics: federation, module, module-federation, module-federation-examples, webpack, webpack-plugin
• Language: JavaScript
• Homepage:
• Size: 7.81 KB
• Stars: 52
• Watchers: 4
• Forks: 9
• Open Issues: 7
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# external-remotes-plugin

**Host webpack.config**

```js

const config = {

   ...otherConfigs

  plugins: [

    new ModuleFederationPlugin({

      name: "app1",

      remotes: {

        app2: "app2@[window.app2Url]/remoteEntry.js"

      }

    }).

    new ExternalTemplateRemotesPlugin(),

  ]

}

```

or

```js

plugins: [

    new ModuleFederationPlugin({

        name: 'my-app',

        remotes: {

            'my-remote-1': 'my-remote-1@[window.remote-1-domain]/remoteEntry.js?[getRandomString()]',

            ...

        },

        shared: {...}

    }),

    new ExternalTemplateRemotesPlugin(), //no parameter,

]

```

**Host (app1) source somewhere before loading main entry file**

```js

window.app2Url = "//localhost:3002"; // Whatever the url/logic to determine your remote module is

import("./bootstrap");

```

Working example is also available in this PR: https://github.com/module-federation/module-federation-examples/pull/557.

**Update:** the PR was merged a example can be found under [advanced-api/dynamic-remotes-synchronous-imports](https://github.com/module-federation/module-federation-examples/tree/d5cf265c2d4fd040797cbae806badd8267ad5b8f/advanced-api/dynamic-remotes-synchronous-imports)