Support dev server remote entry file

[Darshan-Naik]

Running dev should produce remoteEntry.js

currently, we can only use remote build files in the host. there is no way to use running dev remote to talk with the host app which is a pain point for the development productivity.

[flyfishzy]

This is a bit difficult to implement because vite dev is bundleless. Duplicate of #281

[adamsimonini]

I have run into this issue as well. By targeting the build directory I don't get hot reloading of the file a la nodemon + express.js. This means I have to rebuild to get the latest. Bummer.

[tuzkituan]

This is a workaround for me, but you have to manually refresh the host app whenever the sub app changes:

• The host app: Terminal 1: npm run dev

• The sub app: package.json: add "build:watch": "vite build --watch" Terminal 2: npm run build:watch Terminal 3: npm run preview

[marcin-kopanski]

in scripts section of your mf app: "micro": "vite build --watch & vite preview --port 5010 --strictPort", then you can just run yarn micro

[acupofspirt]

@tuzkituan

This is a workaround for me, but you have to manually refresh the host app whenever the sub app changes:

You can solve host refreshing issue by using 2 simple plugins for both sides:

remote side

{
  name: 'vite-plugin-notify-host-on-rebuild',
  apply(config, { command }) {
    return Boolean(command === 'build' && config.build?.watch);
  },
  async buildEnd(error) {
    if (!error) {
      try {
        await fetch('http://your-local-host-url-here/__fullReload');
      } catch (e) {
        // noop
      }
    }
  },
}

host side

{
  name: 'vite-plugin-reload-endpoint',
  configureServer(server) {
    server.middlewares.use((req, res, next) => {
      if (req.url === '/__fullReload') {
        server.hot.send({ type: 'full-reload' });

        res.end('Full reload triggered');
      } else {
        next();
      }
    });
  },
}

[yashwant-dangi]

Use

server.ws.send({ type: 'full-reload' });

with Vite 4 for @acupofspirt solution