{"id":22551,"library":"vite-electron-plugin","title":"vite-electron-plugin","description":"High-performance Vite plugin for Electron development (v0.8.3). Uses esbuild under the hood for fast transforms, supports hot restart and plugin system similar to Vite's own plugin API. Unlike electron-vite, this plugin integrates into an existing Vite config rather than requiring a separate Vite config for Electron. Active development with frequent releases. Ships TypeScript types. Peer dependencies: acorn, esbuild.","status":"active","version":"0.8.3","language":"javascript","source_language":"en","source_url":"https://github.com/electron-vite/vite-electron-plugin","tags":["javascript","vite","plugin","electron","unbuild","typescript"],"install":[{"cmd":"npm install vite-electron-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add vite-electron-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add vite-electron-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for parsing","package":"acorn","optional":false},{"reason":"Peer dependency used for fast transforms","package":"esbuild","optional":false}],"imports":[{"note":"Package exports a default function; use ESM import.","wrong":"const { electron } = require('vite-electron-plugin')","symbol":"default (plugin)","correct":"import electron from 'vite-electron-plugin'"},{"note":"Plugin is a type, use import type to avoid runtime errors.","wrong":"import { Plugin } from 'vite-electron-plugin'","symbol":"type Plugin","correct":"import type { Plugin } from 'vite-electron-plugin'"},{"note":"Configuration is a type export.","wrong":"const { Configuration } = require('vite-electron-plugin')","symbol":"type Configuration","correct":"import type { Configuration } from 'vite-electron-plugin'"}],"quickstart":{"code":"// vite.config.ts\nimport { defineConfig } from 'vite'\nimport electron from 'vite-electron-plugin'\n\nexport default defineConfig({\n  plugins: [\n    electron({\n      include: [\n        // The Electron source code directory\n        'electron',\n      ],\n    }),\n  ],\n})\n\n// electron/main.ts\nimport { app, BrowserWindow } from 'electron'\n\napp.whenReady().then(() => {\n  const win = new BrowserWindow()\n\n  if (process.env.VITE_DEV_SERVER_URL) {\n    win.loadURL(process.env.VITE_DEV_SERVER_URL)\n  } else {\n    win.loadFile('dist/index.html')\n  }\n})","lang":"typescript","description":"Sets up vite-electron-plugin in a Vite config and creates a basic Electron main process entry."},"warnings":[{"fix":"Update all imports from 'vite-plugin-electron' to 'vite-electron-plugin'.","message":"In v0.7.0, the package renamed from 'vite-plugin-electron' to 'vite-electron-plugin'. Old imports break.","severity":"breaking","affected_versions":"<0.7.0"},{"fix":"Use relative paths (e.g., 'electron') or absolute paths that are subdirectories of root.","message":"The 'include' option paths are relative to 'root' (default process.cwd()). Absolute paths must be subpaths of root or output file paths will be incorrect.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Remove 'api' from config and use plugin hooks to pass data.","message":"The 'api' option is deprecated in v0.8.0. Use plugin context instead.","severity":"deprecated","affected_versions":">=0.8.0 <0.8.0"},{"fix":"Ensure Electron main code checks process.env.VITE_DEV_SERVER_URL and loads the appropriate URL or file path.","message":"Hot restart requires the Electron main process to handle process.env.VITE_DEV_SERVER_URL. Missing this conditional can cause white screen.","severity":"gotcha","affected_versions":">=0.0.0"},{"fix":"Name preload scripts or other renderer-only files with the '.reload.extension' pattern to optimize development.","message":"Files ending with '.reload.js' or '.reload.ts' trigger a renderer reload instead of a full restart. Not using this convention can lead to unnecessary full restarts.","severity":"gotcha","affected_versions":">=0.0.0"}],"env_vars":null,"last_verified":"2026-04-27T00:00:00.000Z","next_check":"2026-07-26T00:00:00.000Z","problems":[{"fix":"Run: npm install vite-electron-plugin acorn esbuild","cause":"Package not installed or missing peer dependencies.","error":"Cannot find module 'vite-electron-plugin'"},{"fix":"Add include: ['electron'] (or your Electron source directory) to the plugin options.","cause":"Missing or empty 'include' array in plugin config.","error":"Error: The 'include' option must be a non-empty array"},{"fix":"Use: import electron from 'vite-electron-plugin' (not import { electron } from ...)","cause":"Using named import instead of default import.","error":"TypeError: electron is not a function"},{"fix":"Use a relative path for outDir, e.g., 'dist-electron', or ensure absolute path is inside root.","cause":"'outDir' is an absolute path not under 'root'.","error":"Error: The provided 'outDir' is not a subdirectory of 'root'"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}