Vite plugin: document that vite config for renderer has a default of `base: './'` and explain why this is necessary

[hab25]

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.

[hab25]

Countering my above arguments: I should have been using vite's import.meta.env.BASE_URL because that is more robust by virtue of not being implicitly coupled with the configuration of base in the renderer Vite config.

I.e., I should have done (I'm using React)

<img src={`${import.meta.env.BASE_URL}my-logo.png`} />

However, even if we accept this counterargument, Forge should document why the user cannot change base in the renderer Vite config, as was revealed by my previously described test.

[erickzhao]

Hey @hab25, I think this is a pretty good point. I'll try to take a look when I have the time next week.