Open-source project
cawa-93/vite-electron-builder avatar
cawa-93/vite-electron-builder

cawa-93/vite-electron-builder: a Vite-based Electron boilerplate with a monorepo layout and auto-update

Secure boilerplate for Electron app based on Vite. TypeScript + Vue/React/Angular/Svelte/Vanilla

2,991 stars292 forksTypeScriptMIT

At a glance

What is it?
A template that splits an Electron app into main, preload and renderer packages, wires Vite into the build, and ships a GitHub Actions release workflow. It suits teams that already know Electron and want the security defaults handled for them.
Who is it for?
Adopt it if you already write Electron apps and want the main/preload/renderer split, Playwright end-to-end scaffolding and a GitHub Releases auto-update path without assembling them yourself. Do not adopt it if you are new to Electron, if you want a batteries-included UI, or if you cannot run Node 23 or newer, since package.json sets engines.node to ">=23.0.0".
Can I use it commercially?
Yes. MIT is a permissive licence: you can use, modify and sell software built on it, as long as you keep its copyright and licence notices.
Is it still maintained?
Yes. The repository last received commits 59 days ago.
What is it written in?
Mainly TypeScript, according to GitHub's language statistics.

Answers come from the project's GitHub data, last synced on October 1, 2026, and from our analysis. They are not legal advice.

Editorial analysis

What vite-electron-builder actually removes from your setup work

Electron gives you a main process, a preload script and a renderer, and expects you to decide how each one is bundled, typed and shipped. This template makes those decisions for you. The repository is a monorepo: packages/main holds the main script, packages/preload holds the preload scripts, and the renderer is deliberately absent so you can drop in Vue, React, Angular, Svelte, Preact, Solid or plain JavaScript. Internal packages are named with the @app/* prefix, which the README calls a readability convention rather than a technical requirement.

The intended audience is a developer who has already shipped or at least built an Electron app and now wants the parts that are tedious to get right: the preload bridge, the packaging config, the CI type check and the updater. Someone who has never touched Electron will still have to learn the process model, because the template does not hide it. It exposes it.

The main, preload and renderer split, and the Node APIs you cannot call

The data flow follows Electron's own model. The renderer is a web application and builds like one. The preload script runs in a Node.js-capable context and is the only place allowed to touch Node APIs; the README says that if you need runtime APIs in the frontend, you export a function from the preload package. The main package owns the application lifecycle and the electron-builder configuration lives at the repository root in electron-builder.mjs.

That boundary is the whole design. The README is blunt about the consequence: frontend dependencies such as Vue, React, lodash or axios are fine in the renderer, but native Node modules such as systeminformation cannot be used there and will crash the application. The renderer is imported under the name @app/renderer, and that import name is the one hard contract the template imposes on whatever framework you choose.

Two helper packages support the build rather than the runtime. packages/electron-versions exposes functions that report the versions of the components bundled inside Electron, and packages/integrate-renderer is used only by npm run init to configure a new interface package. The README notes that if you use a bundler other than Vite, packages/dev-mode.js may need small changes to start correctly.

Installing vite-electron-builder and running the first build

The README gives four steps. Use the template button on GitHub or clone the repository, then run npm run init, which chains create-renderer, integrate-renderer and an install with scripts ignored. The root package.json requires Node 23.0.0 or newer, so check that before anything else.

bash
npm run init

The init script is interactive: it creates the renderer package and configures it. Once it finishes, start the development mode.

bash
npm start

That runs node packages/dev-mode.js, which the README describes as the dev-mode entry point. You should see the Electron window open with your chosen framework's starter page. When you are ready to produce an artifact, compile it.

bash
npm run compile

This runs the workspace build and then electron-builder build with the config in electron-builder.mjs. The README states the resulting executable is shareable but will not support auto-updates out of the box. Type checking is separate.

bash
npm run typecheck

End-to-end tests are Playwright specs in the tests directory, run through npm test.

Auto-update only works if you publish, and the template assumes GitHub Releases

This is the constraint most likely to surprise a first-time user. The README separates two paths: compiling locally gives you a file you can hand to someone, while auto-update requires compiling and publishing to a distribution source. The release.yml workflow does that publishing, and the README says the template is configured for GitHub Releases but that electron-builder supports other publish targets.

The practical consequence is that auto-update is a property of your release pipeline, not of the template. Push to main and the ci workflow creates and deploys a new version that running instances download and apply. If you compile on your laptop and send the binary to a colleague, no update will ever reach them. The README also points to the Deployment section of the repository for demo builds across frameworks and operating systems, and suggests installing an outdated version there to watch the updater work. That is the only verification path the README describes.

Where vite-electron-builder is the wrong choice

The renderer is not included, and that is not a small omission. If you want a working application with a UI on day one, this template gives you a build pipeline and a blank page. You supply the framework, the routing, the state and the components. Teams that expect a scaffolded product will spend their first hours doing exactly the work the template declined to do.

The Node 23 minimum is a second filter. Projects pinned to an older LTS cannot use it without upgrading their runtime, and the engines field is a hard declaration rather than a suggestion. Third, the README states that the project is maintained by a developer in Ukraine and that the invasion limits the energy available for open source work. That is a candid statement about capacity, and anyone depending on fast upstream fixes should weigh it. Finally, the security posture is inherited from Electron's own guidance rather than from an audit: the template follows the recommendations, but it does not add a sandboxing layer of its own beyond what the framework provides.

How it differs from Electron Forge and from a plain Vite scaffold

Electron Forge is the official Electron tooling and takes a plugin-based approach: you pick makers and plugins, and the tooling is configured around them. vite-electron-builder instead commits to one stack, Vite plus electron-builder, and organizes the application as npm workspaces where each package can carry its own dependencies, tests and framework. The difference shows up when you want to swap the renderer: here it is a workspace you replace, and the README says the only requirement is that it be importable as @app/renderer.

Against a bare Vite scaffold or a generic electron-vite starter, the difference is the release machinery. Those give you a dev server and a build. This repository adds a type-check workflow, Playwright end-to-end tests, an electron-builder config and a release workflow that publishes updates. If you never intend to ship auto-updating desktop builds, that machinery is overhead you will maintain for nothing.

Licence, upgrade cost and what the README does not cover

The repository is MIT licensed, and the root package.json marks the workspace private and versioned at 3.1.0. MIT is permissive, so you can build and distribute a closed-source application from the template; the usual obligation to preserve the copyright notice applies, and nothing here constitutes legal advice. Note that the template bundles Electron, electron-builder, Playwright and Vite as dev dependencies with pinned versions, so upgrading Electron means re-checking the preload boundary and the packaging config rather than bumping one number.

The upgrade surface is wider than a single dependency because the template is a starting point you fork. Once you have modified packages/main and the electron-builder config, pulling upstream changes becomes a manual merge. The README does not document a rollback path for a bad auto-update, nor does it describe how to pin clients to a known-good release. If your distribution requires staged rollouts or a rollback channel, that logic is yours to add, and electron-builder's publish configuration is where the README points you.

Editorial conclusion

Adopt it if you already write Electron apps and want the main/preload/renderer split, Playwright end-to-end scaffolding and a GitHub Releases auto-update path without assembling them yourself. Do not adopt it if you are new to Electron, if you want a batteries-included UI, or if you cannot run Node 23 or newer, since package.json sets engines.node to ">=23.0.0". Before committing, run npm run init, npm start and npm run compile on your target platform, and confirm that your distribution channel is one electron-builder can publish to, because the README states that a locally compiled executable does not support auto-updates out of the box.

Frequently asked questions

What Node version does vite-electron-builder require?

The root package.json declares engines.node as ">=23.0.0", so the workspace expects Node 23 or newer. Check this before running npm run init, since the install step runs inside the same workspace.

Does vite-electron-builder include a renderer or a UI?

No. The README states the repository does not contain a package implementing the interface, and that you create one interactively with npm run init. The only requirement is that the renderer be importable as @app/renderer.

Can I use Node.js APIs in the renderer of a vite-electron-builder app?

No. The README says native Node.js APIs are only available in a Node.js runtime environment and will crash the application if used in the renderer. The documented workaround is to export a function from the preload package.

Does a locally compiled vite-electron-builder app support auto-updates?

The README states that compiling locally with npm run compile produces an executable you can share, but it will not support auto-updates out of the box. Auto-update requires compiling and publishing to a supported distribution source.

Official sources

  1. cawa-93/vite-electron-builder on GitHub
  2. Issues
  3. License: MIT
  4. README
  5. Releases
Add this badge to your README

If you maintain this project, the badge below links readers to this analysis and shows its maintenance status from the daily GitHub snapshot. Paste the markdown into your README; add ?metric=license or ?metric=stars to the image URL for a different field.

Add this badge to your README

markdown
[![Hysen Labs](https://hysenlabs.com/badge/cawa-93-vite-electron-builder.svg)](https://hysenlabs.com/projects/cawa-93-vite-electron-builder)