vite icon indicating copy to clipboard operation
vite copied to clipboard

Support CommonJS/UMD modules in dev mode

Open echjordan0 opened this issue 1 year ago • 0 comments

Hello and thank you again for this plugin. We spoke a bit in this issue and I am working on implementing the plugin for both host and remote (no webpack). Everything seems to work quite well with vite build and vite preview but I am unable to use vite dev mode (vite). It seems that once I add the plugin, pre-bundling of Common JS/UMD to ESM, which as I understand it is standard behavior for Vite, no longer happens? Or is happening incorrectly? I understand I could alias to the ESM distribution for dev mode but we are still on Vue 2 and have some older packages that do not distribute an ESM version of the module so we would be blocked from using the plugin by this issue.

Relevant packages: "vue": "2.7.14", "@module-federation/vite": "^0.2.8", "@softarc/native-federation": "^2.0.4", "@softarc/native-federation-esbuild": "^2.0.4", "@vitejs/plugin-vue2": "1.1.2",

Host config

    await federation({
      options: {
        workspaceRoot: __dirname,
        outputPath: 'dist',
        tsConfig: 'tsconfig.json',
        federationConfig: 'federation.config.ts',
        verbose: true,
        dev: command === 'serve',
      },
      adapter: createEsBuildAdapter({ plugins: [] }),
    }),

Remote config

    await federation({
      options: {
        workspaceRoot: __dirname,
        outputPath: 'dist',
        tsConfig: 'tsconfig.json',
        federationConfig: 'federation.config.ts',
        verbose: true,
        dev: command === 'serve',
      },
      adapter: createEsBuildAdapter({
        plugins: [pluginVue()],
      }),
    }),

Example error for package with no esm distribution: Screenshot 2023-11-21 at 12 32 35 PM

echjordan0 avatar Nov 21 '23 20:11 echjordan0