This caught me by surprise, as it was not documented anywhere and is inconsistent with main and preload. In these latter two, which have default base: "/"
(since, AFAIU, that is Vite's default and Forge does not modify it), you use "/..."
to refer to assets coming from Vite's public directory.
I ran into this while trying to debug why my image, coming from Vite's public directory, wasn't being loaded by the HTML
<img src="/my-logo.png"/>
by the packaged app, logging a "resource not found" error in the Chromium DevTools console.
Note that it was correctly loading during development (i.e., electron-forge start
).
The fix was to change to
<img src="./my-logo.png"/>
, and this works both in development and in the packaged app.
I only found this fix after looking at the source code for the plugin; see
https://github.com/electron/forge/blob/cd63f57bd6870af2ad847076a183456221b30269/packages/plugin/vite/src/config/vite.renderer.config.ts#L16 .
The following test I did might be useful when you are trying to remember why this non-default base
is needed for the renderer:
When I tried setting base: "/",
in my Vite renderer config, the packaged app wouldn't even load any part of the HTML UI.