skills.rest
tryplover
tryploverOFFICIAL
Explore all skills by this author →
WebsiteGitHub

plover-electron-vite-build

Diagnose and fix electron-vite build and runtime errors in pnpm workspace Electron apps.

1|Updated May 24, 2026
Search Tags:#debugging#troubleshooting#Electron#pnpm#vite#build errors#electron-vite
One-click install
npx skills add https://github.com/tryplover/Plover --skill plover-electron-vite-build-tryplover
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: plover-electron-vite-build
Source: https://github.com/tryplover/Plover/tree/main/.claude/skills/plover-electron-vite-build
Command: npx skills add https://github.com/tryplover/Plover --skill plover-electron-vite-build-tryplover

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Electron apps bundled with electron-vite under a pnpm workspace hit a recurring set of cryptic build and runtime failures — broken Electron installs, duplicate __dirname declarations, blank white screens from React version mismatches, preload scripts output as .mjs, and secondary BrowserWindows loading the wrong page. This Skill maps each symptom to its root cause and exact fix. ## Core Features & Use Cases - Symptom-to-fix lookup table: Matches five common electron-vite error signatures directly to their resolutions. - Root cause analysis: Explains why pnpm's symlinked virtual store breaks dependency externalization, why Vite injects __dirname shims, and why React 18/19 mismatches crash at mount. - Use Case: Your pnpm dev run fails with "Electron failed to install correctly" — the Skill tells you to add electron, better-sqlite3, and keytar to build.rollupOptions.external in electron.vite.config.ts. ## Quick Start Ask the AI to diagnose why your electron-vite dev run shows a blank white screen or fails with an Electron install error, and apply the matching fix to electron.vite.config.ts.

Frequently Asked Questions about plover-electron-vite-build

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

FAQPage Schema
How do I fix "Electron failed to install correctly" with electron-vite and pnpm?▼

Add electron and native modules like better-sqlite3 and keytar to build.rollupOptions.external under main and preload in electron.vite.config.ts. Under pnpm, the symlinked .pnpm store breaks electron-vite's automatic externalization, causing electron to be bundled inline.

Why does my Electron app show a blank white screen with a react-dom_client.js error?▼

The error "Cannot read properties of undefined (reading 'S')" means react and react-dom are on different major versions, such as react 18 with react-dom 19. Pin both to the same major version in package.json and reinstall.

How do I fix "Identifier '__dirname' has already been declared" in a Vite build?▼

Delete any manual const __dirname declarations in your source files. Vite injects its own __dirname shim into the bundle, so use Node's native import.meta.dirname directly, which is supported in Node 20.11 and later.

Why is my electron-vite preload script built as index.mjs instead of index.js?▼

With "type": "module" in package.json, Rollup defaults to ESM .mjs output even when entryFileNames specifies .js. Force format: 'cjs' and entryFileNames: '[name].js' in the preload config's Rollup output options.

Why does my secondary BrowserWindow load the main app in dev mode?▼

The dev loadURL path does not match the production loadFile path structure. Vite's dev server serves files at their real path relative to root, so /companion.html falls back to the root index.html; use /companion/index.html instead.

Related Skills

Explore More Software Engineering Skills→
muhammaddadumuhammaddadu
1

electron

Build, secure, and package Electron desktop apps with typed IPC and native window effects.

Community
Advanced
webdevcodywebdevcody
22

publish-on-npm

Publish Electron desktop apps to npm with per-platform optionalDependencies.

Community
Advanced
renuorenuo
3

deploio-debug

Diagnose and fix Deploio app crashes, build failures, and runtime errors.

Official
Advanced
benjr70benjr70
1

electron

Implements Electron Forge desktop apps with React, Webpack, IPC, and kiosk-mode displays.

Community
Intermediate