'SVG Images not showing if Vue app is converted to Electron app

I built an Vue 3 app (+ Vite) which I want to also convert to an Electron app. Every time I start the Electron app via electron . it looks like the SVG isn't getting packaged: (Navigation Drawer with missing icons)

Upon further investigation this is the case, but in my dist folder all images are available. (SVGs are in the dist folder) But the Devtools show that they don't get into the Electron app. (Electron app asset folder)

I also implemented the workaround for changing the base path in the Vite config like this (The Electron ENV gets set before I run electron . via a npm script):

import { fileURLToPath, URL } from "url";

import { defineConfig } from "vite";
import vue from "@vitejs/plugin-vue";
import path from "path";

// https://vitejs.dev/config/
export default defineConfig({
  base:
    // eslint-disable-next-line no-undef
    process.env.ELECTRON == "true" ? path.resolve(__dirname, "./dist/") : "./",
  plugins: [vue()],
  resolve: {
    alias: {
      "@": fileURLToPath(new URL("./src", import.meta.url)),
    },
  },
  assetsInclude: ["**/*.svg"],
});

Does anyone have an idea what the problem might be? Thanks in advance!

UPDATE I got it working after all by following this example: https://github.com/pengYYYYY/vite-electron. Also a base tag was missing in my index.html. Like that: <base href="./" />



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source