v1.0.0: host in dev mode throws error trying to connect to remote in build mode

[husayt]

How to reproduce:

1. run host with vite preview
2. run remote with vite dev
3. open host on localhost:5175
4. see error

AgGridDemo.jsx:1  Uncaught Error: @vitejs/plugin-react can't detect preamble. Something is wrong. See https://github.com/vitejs/vite-plugin-react/pull/11#discussion_r430879201
    at AgGridDemo.jsx:1:46

PS. I updated the description

[zhangHongEn]

I tried but couldn't reproduce host npm run dev remote npm run preview

"preview": "vite build && vite preview --port 5176"

[husayt]

@zhangHongEn I added more examples here try that please

[husayt]

I tried but couldn't reproduce host npm run dev remote npm run preview

"preview": "vite build && vite preview --port 5176"

@zhangHongEn sorry, I mixed up, it is other way round. Try host in preview and remote in dev mode

[zhangHongEn]

Yes, this is a common problem. React hot update conditions are very strict. There needs to be a way to elegantly process the host's react into a development version, and then add the relevant code of react-refresh.

[husayt]

if host in prod mode, it is ok to disable a react-refresh and hot-module reloading in remote. We shouldn't even try the opposite

[zhangHongEn]

if host in prod mode, it is ok to disable a react-refresh and hot-module reloading in remote. We shouldn't even try the opposite

This approach is often encountered in real scenarios, such as developing only a remote module without starting the host. And the mf rust plugin seems to wrap react to handle this

[zhangHongEn]

The module-federation Chrome plugin allows you to develop only the remote without starting the host

[husayt]

currently it just throws an error. If it is easier to get HMR disabled in remote then let's do that for now. In future version we can add support for HMR in remote with prod host as a new feature. This way at least it will not be crashing until then

[husayt]

This is the current roadmap. We might add that here (i.e. HMR for prod host).

roadmap

• feat: generate mf-manifest.json
• feat: support chrome plugin

• ✅ ~~feat: support runtime plugins~~

• feat: download remote d.ts
• feat: generate d.ts
• feat: support @vitejs/plugin-legacy

[zhangHongEn]

Yes. Currently, if the host is in build mode, you need to disable remote HMR. React HMR is an enhanced feature. I will find time to implement it in the future. For example, HMR for Vue is very simple.

[husayt]

Thank you @zhangHongEn. I really appreciate your efforts here in trying to solve this long standing problem with Vite MF support. In one month there has been more progress than in last 2-3 years. And @gioboa's support been amazing too

[husayt]

The module-federation Chrome plugin allows you to develop only the remote without starting the host

@zhangHongEn you mentioned chrome plugin. But as far as I know (also in Roadmap) we still don't support Chrome extension. So I couldn't use remote with this chrome extension

[zhangHongEn]

Output mf-manifest.json to support chrome plugins

[zhangHongEn]

This is not a bug of this plug-in, but an enhanced function. I have added roadmap and it should be able to be turned off @husayt @gioboa