electron-base

Develop secure cross-platform desktop apps with Electron, Vite, React, and TypeScript.

Updated Feb 14, 2026
One-click install
npx skills add https://github.com/itsimonfredlingjack/ELECTRON-prompt-builder --skill electron-base
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: electron-base
Source: https://github.com/itsimonfredlingjack/ELECTRON-prompt-builder/tree/main/.cursor/skills/electron-base
Command: npx skills add https://github.com/itsimonfredlingjack/ELECTRON-prompt-builder --skill electron-base

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires electron, electron-store, better-sqlite3, electron-builder, electron-rebuild, vite-plugin-electron, vite-plugin-electron-renderer, node-machine-id, and includes scripts (resource) and references (resource) and templates (resource) components.

What problem does it solve?

This Skill provides a robust foundation for building secure, cross-platform desktop applications using Electron, Vite, React, and TypeScript, addressing common challenges like inter-process communication, authentication, and packaging.

Core Features & Use Cases

  • Secure IPC: Implements type-safe communication between main and renderer processes using contextBridge.
  • OAuth Integration: Guides through setting up OAuth flows with custom protocol handlers for secure authentication.
  • Native Module Support: Details how to manage native modules like better-sqlite3 and electron-store, including build and sandbox considerations.
  • Packaging: Covers configuration for electron-builder for macOS, Windows, and Linux.
  • Use Case: Developing a desktop application that requires secure user login via OAuth, local data storage, and needs to be packaged for distribution on multiple operating systems.

Quick Start

Follow the project structure and package.json updates outlined in the documentation to initialize a new Electron project.

Frequently Asked Questions about electron-base

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up type-safe IPC in an Electron app with React and TypeScript?

Type-safe IPC in Electron is achieved using the contextBridge API to securely expose main process functions to the renderer. This ensures React and TypeScript communicate safely without exposing Node.js APIs directly.

What's the best way to implement OAuth login in an Electron desktop app?

OAuth login in an Electron desktop app is best implemented using custom protocol handlers. This intercepts authentication redirects securely, allowing your application to capture tokens without embedding insecure browser views.

How do I configure electron-builder for cross-platform desktop app packaging?

Cross-platform desktop app packaging with electron-builder requires defining target configurations for macOS, Windows, and Linux in your package.json. This handles asset bundling and native module rebuilding for each OS.

Does better-sqlite3 work with Electron sandboxing and native modules?

Yes, better-sqlite3 works with Electron by using electron-rebuild to compile native modules against the Electron runtime. This ensures compatibility when sandboxing is enabled and local data storage is required.

Why should I use context isolation when building a secure Electron application?

Context isolation should be used to build secure Electron applications because it prevents renderer processes from directly accessing Node.js APIs. This mitigates security risks like prototype pollution and malicious script injection.

How do I integrate Vite with Electron for React development?

Vite integrates with Electron using vite-plugin-electron and vite-plugin-electron-renderer. This configuration optimizes React development by providing fast hot module replacement alongside native Electron module support.