vite-plugin-electron does not create nested folders inside main folder when it compiles

578 Views Asked by At

Im trying to struct my electron folder like this:

enter image description here

but vite-plugin-electron doesn't create the api folder instead it compiles on the root folder:

enter image description here

this is my vite config file:

import { defineConfig } from "vite";
import electron from "vite-plugin-electron";
import renderer from "vite-plugin-electron-renderer";
import react from "@vitejs/plugin-react";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    react(),
    electron([
      {
        // Main-Process entry file of the Electron App.
        entry: "electron/main.ts",
      },
      {
        entry: "electron/preload.ts",
        onstart(options) {
          // Notify the Renderer-Process to reload the page when the Preload-Scripts build is complete,
          // instead of restarting the entire Electron App.
          options.reload();
        },
      },
      {
        entry: "electron/api/upload.ts",
      },
    ]),
    renderer(),
  ],
});

I looked on the vite-plugin-electron docs but didn't found something like outDir property that i can specify by my self.

1

There are 1 best solutions below

0
On BEST ANSWER

I opened an issue in their github repo and they helped me. This is the solution:

import { defineConfig } from "vite";
import electron from "vite-plugin-electron";
import renderer from "vite-plugin-electron-renderer";
import react from "@vitejs/plugin-react";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [
    react(),
    electron([
      {
        // Main-Process entry file of the Electron App.
        entry: "electron/main.ts",
      },
      {
        entry: "electron/preload.ts",
        onstart(options) {
          // Notify the Renderer-Process to reload the page when the Preload-Scripts build is complete,
          // instead of restarting the entire Electron App.
          options.reload();
        },
      },
      {
        entry: "electron/IpcRenderer/upload.ts",
        vite: {
          build: {
            outDir: "dist-electron/IpcRenderer",
          },
        },
      },
      {
        entry: "electron/IpcMain/upload.ts",
        vite: {
          build: {
            outDir: "dist-electron/IpcMain",
          },
        },
      },
    ]),
    renderer(),
  ],
});

this will compile files into the specified directory on the outDir property