electron-vite-react

English | 简体中文

Overview

📦 Out of the box
💪 Support C/C++ addons
🔩 Support Use Electron、Node.js API in Renderer-process
🌱 Simple directory structure，real flexible
🖥 It's easy to implement multiple windows

Quick start

npm create electron-vite

Debug

Directory structure

🚨 By default, the files in electron folder will be built into the dist/electron

├── electron                  Electron-related code
|   ├── main                  Main-process source code
|   ├── preload               Preload-script source code
|   └── resources             Resources for the production build
|       ├── icon.icns             Icon for the application on macOS
|       ├── icon.ico              Icon for the application
|       ├── installerIcon.ico     Icon for the application installer
|       └── uninstallerIcon.ico   Icon for the application uninstaller
|
├── release                   Generated after production build, contains executables
|   └──{version}
|       ├── {os}-unpacked     Contains unpacked application executable
|       └── Setup.{ext}       Installer for the application
|
├── public                    Static assets
└── src                       Renderer source code, your React application

dependencies vs devDependencies

• First, you need to know if your dependencies are needed after the application is packaged.

• Like serialport, sqlite3 they are node-native modules and should be placed in dependencies. In addition, Vite will not build them, but treat them as external modules.

• Dependencies like Vue and React, which are pure javascript modules that can be built with Vite, can be placed in devDependencies. This reduces the size of the application.