Vite

Vite Skill

This project uses electron-vite 5 (not plain Vite) — a single electron.vite.config.ts configures three separate Vite builds for Electron's main, preload, and renderer processes. The renderer uses Vite 7 with React, Tailwind CSS 4, TanStack Router, and React Compiler.

Project Config

The unified config lives at electron.vite.config.ts:

import { defineConfig } from "electron-vite";
import react from "@vitejs/plugin-react";
import tailwindcss from "@tailwindcss/vite";
import { tanstackRouter } from "@tanstack/router-plugin/vite";
import { resolve } from "path";
import { viteStaticCopy } from "vite-plugin-static-copy";

export default defineConfig({
  main: {
    build: {
      outDir: "dist/main",
      rollupOptions: { input: { index: resolve(__dirname, "src/main.ts") } },
    },
    resolve: { alias: { "@": resolve(__dirname, "./src") } },
  },
  preload: {
    build: {
      outDir: "dist/preload",
      rollupOptions: { input: { index: resolve(__dirname, "src/preload.ts") } },
    },
  },
  renderer: {
    root: ".",
    build: {
      outDir: "dist/renderer",
      rollupOptions: { input: { index: resolve(__dirname, "index.html") } },
    },
    publicDir: false,
    plugins: [
      viteStaticCopy({ targets: [{ src: "assets", dest: "." }] }),
      tanstackRouter({ target: "react", autoCodeSplitting: true }),
      tailwindcss(),
      react({ babel: { plugins: ["babel-plugin-react-compiler"] } }),
    ],
    resolve: {
      preserveSymlinks: true,
      alias: { "@": resolve(__dirname, "./src") },
    },
  },
});