docs: var host + esm remote (vite) workaround

[crutch12]

Description

If we build remote application using @module-federation/vite, it generates esm remoteEntry.js file, thus we are not able to import it in host application with "old fashion way" (see example)

It becomes a huge problem when we are not able to rewrite our host application (this is my case, I don't control host application at all).

Therefore I've come up with some workaround (see docs changes).

I've tested it with webpack/vite, with buildtime/runtime usages and it works like a charm.

If you like this solution I will add Chinese translation too.

Related Issue

originjs/vite-plugin-federation#368
module-federation/vite#247

Types of changes

• Docs change / refactoring / dependency upgrade
• Bug fix (non-breaking change which fixes an issue)
• New feature (non-breaking change which adds functionality)

Checklist

• I have added tests to cover my changes.
• All new and existing tests passed.
• I have updated the documentation.

[changeset-bot]

⚠️ No Changeset found

Latest commit: e6d90e2

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[netlify]

✅ Deploy Preview for module-federation-docs ready!

Name	Link
🔨 Latest commit	e6d90e2
🔍 Latest deploy log	https://app.netlify.com/projects/module-federation-docs/deploys/690e07ed50d12200080a762a
😎 Deploy Preview	https://deploy-preview-4199--module-federation-docs.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[crutch12]

@danpeen or @2heal1 could you check it please? wdyt?

[crutch12]

Since we are not able to generate var bundle files using @module-federation/vite, I think it would be great to have this workaround in docs.

Moreover: I would like to be able to generate varRemoteEntry.js file using @module-federation/vite with varFilename option

Example:

// vite.config.ts

import { federation } from '@module-federation/vite';

// ...

federation({
  name: 'viteRemote',
  filename: 'remoteEntry.js', // for "esm" environments
  varFilename: 'varRemoteEntry.js', // from "var" environments
  // ...
})

@gioboa wdyt? I could publish feature request in https://github.com/module-federation/vite

[gioboa]

@gioboa wdyt? I could publish feature request in https://github.com/module-federation/vite

Yes, you can drop a PR for that 👍 thanks