Allow multiple preload configs or renderer configs

[andersk]

Clear and concise description of the problem

I’m working on an app that uses multiple preload scripts (one for the main window and one for embedded webviews). This works with vite-plugin-electron. I’m interested in trying electron-vite for better performance, but it seems electron-vite only supports one preload configuration.

Suggested solution

Allow preload and renderer to be arrays of Vite configs.

Alternative

No response

Additional context

No response

Validations

• Follow the Code of Conduct.
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.

[alex8088]

electron-vite already supports these.

• https://evite.netlify.app
• https://evite.netlify.app/guide/dev.html#multiple-windows-app

[andersk]

Ah thanks, sorry for the noise!

[andersk]

I’m getting around to trying this; unfortunately, providing multiple inputs to a single rollupOptions doesn’t actually work here. When multiple preloads have shared dependencies, Rollup puts those in shared chunks to be loaded via require(), which fails when Electron sandboxing is enabled (as required for security).

• Error in electron-vite: Unable to load preload script because of "missing file" in chunks folder. #282 (comment)
• Add possibility to disable code splitting / chunks generation rollup/rollup#2756
• Is it possible to replicate a module into multiple chunks? rollup/rollup#3927

Since Rollup fundamentally lacks support for disabling chunks and duplicating shared dependencies into every output, we need a way for electron-vite to create multiple independent Rollup configs for preloads.

[alex8088]

@andersk
check out: https://electron-vite.org/guide/dev#limitations-of-sandboxing
Because the require function is a polyfill with limited functionality, you will not be able to use CommonJS modules to separate your preload script into multiple files, unless sandbox: false is specified.

When different preloads import some shared methods or modules and the output format is CommonJS, chunks will definitely be generated. UMD format can be output to a single file but not apply to preload scripts. It is best to refactor the shared modules and import them separately.

[andersk]

Like I said, I understand that the Electron sandbox doesn’t support chunks, and that a single Rollup configuration with multiple inputs doesn’t support avoiding chunks. That is why my request is for electron-vite to use multiple Rollup configurations, each with a single input. That way there is nothing to share and extra chunks will not be generated. (Just like the way it already avoids generating chunks for code shared between the main and renderer processes, for example.)

sandbox: false is not a viable option due to its reduced security.

[alex8088]

@andersk
I understand your idea now, maybe letting preload support a set of configurations just like rollup can avoid this problem. But it is restricted by Vite. But I think it is still worth trying.

[alex8088]

Is there any better suggestion?

[andersk]

It would be better if Electron, Rollup, and Vite had better support for this, but they don’t, so the only option I see is for electron-vite to allow the creation of multiple Vite configurations.

My specific proposal is to allow the user to provide preload as either a single config (like today) or as an array of configs, which would then be processed separately from each other just like main, preload, and renderer are processed separately today.

// electron.vite.config.js
export default {
  …
  preload: [
    {
      // first preload config
    },
    {
      // second preload config
    },
    {
      // third preload config
    },
  ],
  …
}

[Mesimpler]

i think is unnecessary. you can define a adapter function to solve this.
config.js is jsut a js object, you can split chunk and import, just ensure final result is legal.

[andersk]

@Mesimpler Your comment doesn’t make sense. The discussion is about chunking in the output of electron-vite, not chunking the config file itself.

[LukeHagar]

Being able to provide multiple main configs would also solve the issue that led to me creating this PR #412

[alex8088]

Plan to support this feature

[asmodai1985]

@andersk I also encountered this problem and came across this post today by chance. It appears I'm not the only one facing this issue, so I tried writing a plugin to temporarily solve the problem. This is just for reference.

import { build } from 'vite'

export function buildPreloadPlugin(...inputs) {
  let config
  return {
    name: 'buildPreloadPlugin',
    config(originalConfig) {
      config = {
        ...originalConfig,
        plugins: originalConfig.plugins.filter((p) => {
          return p.name !== 'buildPreloadPlugin'
        })
      }
    },
    buildEnd() {
      inputs.forEach((input) => {
        build({
          ...config,
          build: {
            ...config.build,
            emptyOutDir: false,
            rollupOptions: {
              ...config.build.rollupOptions,
              input: [input]
            }
          }
        })
      })
    }
  }
}