Based on Vite, designed to work with Electron.
Inherit all the benefits of Vite and use the same way as Vite.
See Vite features.
electron-vite can intelligently bundle source code for Electron's unique environment.
The main process and preload scripts: whether in development or production, these will be bundled as CommonJS modules, and run in Node.js environment.
Renderers: During development, electron-vite will convert CommonJS / UMD modules to ES modules to support HMR. During production, these will be bundled as IIFE modules, and run in browser environment.
Centralized Configuration and Pre-configured
If you use Vite to bundle your Electron source code, the project structure might like this:
├──main │ ├──... │ └──vite.config.js ├──preload │ ├──... │ └──vite.config.js └──renderer ├──... └──vite.config.js
In electron-vite, all Vite configurations are combined into one file. The project structure like this:
├──src/ │ ├──main │ ├──preload │ └──renderer ├──electron.vite.config.js └──package.json
Furthermore, electron-vite has many built-in configurations, such as
external, etc. Smart parsing and configuration checks are also performed.
HMR For Renderers
Thanks to Vite's extremely fast HMR feature, we use it in renderer development. It will extremely improve Electron's development efficiency.
Check out the Using HMR section to learn more about this feature.
Hot reloading refers to quickly rebuilding and restarting the Electron app when the main process or preload scripts module changes. In fact, it's not really hot reloading, but similar. It also brings a good development experience to developers.
Check out the Hot Reloading section to learn more about this feature.
In addition to supporting the static asset handling in web app like Vite， electron-vite also optimizes asset handling in the Electron main process.
Check out the Asset Handling section to learn more about this feature.
Source Code Protection
electron-vite use V8 bytecode to protect source code.
Check out the Source Code Protection section to learn more about this feature.
electron-vite creates an optional
swcPlugin which is powered by
swc to replace Vite's esbuild plugin to support TypeScript decorator.
Check out the TypeScript Decorator section to learn more about this feature.
electron-vite provides Node.js worker threads support for the Electron main process.
Check out the Workers section to learn more about this feature.
Very easy to debug in IDE like
Check out the Debugging in VSCode section to learn more about this feature.