Chrome & Edge latest update broken Vue based applications on production.

[n-anilrathod]

Versions

• vite-plugin-federation: 1.3.6
• @quasar/app-vite: 1.8.0
• quasar: 2.17.0

Reproduction

• CMD git clone [email protected]:originjs/vite-plugin-federation.git
• CMD cd vite-plugin-federation/packages/examples/vue3-advanced-demo
• CMD pnpm install
• CMD pnpm run build:remotes && pnpm run serve:remotes
• CMD pnpm run dev:hosts
• open http://localhost:5000/

What is actually happening?

Vite + Quasar app with vite-federation-plugin is not working in production mode (vite preview)

[SkyWalker653]

Here's how I resolved the issue for me:

1. Integrated the plugin vite-plugin-top-level-await.

2. Set the build target to browser: ['es2022'] in the quasar.config.js file.

3. (Optional) If the issue persists, add the following code to your package.json file:

   "overrides": {
     "vite": "^4.0.0",
     "@vitejs/plugin-vue": "^4.0.0"
   }

[azieh]

Hi,
The same issue happened on my end. Because of the many distributed installations and applications, we have a big problem. We started receiving the next complaints with our apps after the Chromium update. All works on older browser versions.

[azieh]

Here's how I resolved the issue for me:

1. Integrated the plugin vite-plugin-top-level-await.
2. Set the build target to browser: ['es2022'] in the quasar.config.js file.
3. (Optional) If the issue persists, add the following code to your package.json file:

   "overrides": {
     "vite": "^4.0.0",
     "@vitejs/plugin-vue": "^4.0.0"
   }

This solution works for me. Thank you for your help.

[n-anilrathod]

Here's how I resolved the issue for me:

1. Integrated the plugin vite-plugin-top-level-await.
2. Set the build target to browser: ['es2022'] in the quasar.config.js file.
3. (Optional) If the issue persists, add the following code to your package.json file:

   "overrides": {
     "vite": "^4.0.0",
     "@vitejs/plugin-vue": "^4.0.0"
   }

Thanks for sharing details. I've included the vite-plugin-top-level-await without any additional changes, and it worked for me.

[parkjinu]

Here's how I resolved the issue for me:

1. Integrated the plugin vite-plugin-top-level-await.
2. Set the build target to browser: ['es2022'] in the quasar.config.js file.
3. (Optional) If the issue persists, add the following code to your package.json file:

   "overrides": {
     "vite": "^4.0.0",
     "@vitejs/plugin-vue": "^4.0.0"
   }

Thank you so much.

[jaderanderson]

Here's how I resolved the issue for me:

1. Integrated the plugin vite-plugin-top-level-await.
2. Set the build target to browser: ['es2022'] in the quasar.config.js file.
3. (Optional) If the issue persists, add the following code to your package.json file:

   "overrides": {
     "vite": "^4.0.0",
     "@vitejs/plugin-vue": "^4.0.0"
   }

This fixed my issues with production builds. I didn't needed to change the package.json just adding the plugin and the options in vite.config.ts

Thank you

[RafaDev-gft]

It does not work for me, I am importing the library and I put the configuration in my vite.config.ts like this, am I doing something wrong?

export default defineConfig({
  plugins: [
    topLevelAwait({
      promiseExportName: "__tla",
      promiseImportName: i => `__tla_${i}`
    }),
    react(),
    federation({
      name: "remote-user-management",
      filename: "remoteEntry.js",
      remotes: {
        remoteUtilities: "http://localhost:5001/assets/remoteEntry.js",
      },

[DevShoesed]

Here's how I resolved the issue for me:

1. Integrated the plugin vite-plugin-top-level-await.
2. Set the build target to browser: ['es2022'] in the quasar.config.js file.
3. (Optional) If the issue persists, add the following code to your package.json file:

   "overrides": {
     "vite": "^4.0.0",
     "@vitejs/plugin-vue": "^4.0.0"
   }

Hi, i have the same issue with React application.

The workaround doesn't work for me.