Top level await makes it difficult to target support for older browser versions about vite-plugin-federation HOT 6 CLOSED

There are currently 2 solutions. First, you can set the build.target to specified browsers.

build: {
    target: ["chrome89", "edge89", "firefox89", "safari15"],
  },

Another option is use plugin vite-plugin-top-level-await .

import federation from '@originjs/vite-plugin-federation'
import topLevelAwait from 'vite-plugin-top-level-await'

export default defineConfig({
  plugins: [
    federation({
 ...
       }),
    topLevelAwait({
      // The export name of top-level await promise for each chunk module
      promiseExportName: '__tla',
      // The function to generate import names of top-level await promise in each chunk module
      promiseImportName: i => `__tla_${i}`
    })
  ],
  build: {
    target:"es2015"
  }
})

from vite-plugin-federation.

This might be one of the issues to consider, maybe try using then instead of top-level await, but I'm not sure if that would cause some weird problems

from vite-plugin-federation.

Having the same issue when I try to use terser instead of esbuild. I had to disable this plugin infortunately, while keeping subscribed to this thread.

from vite-plugin-federation.

Having the same issue, is there any progress there?

from vite-plugin-federation.

Since the solution already exists, close

from vite-plugin-federation.

It seems this issue is not resolved in v 1.1.6. I am able to shim top level await but with build target es2015 I get the following error and the styles for my remote are indeed not applied.

The remote style takes effect only when the build.target option in the vite.config.ts file is higher than that of "es2020".
(anonymous) @ instrument.js:111
d @ remoteEntry.js:1
./microfrontend @ remoteEntry.js:1
h @ remoteEntry.js:1
(anonymous) @ routes.ts:797

Is it possible to use this plugin with a build target below es2020?

from vite-plugin-federation.