Skip to content

Latest commit

 

History

History
60 lines (44 loc) · 2.86 KB

README.md

File metadata and controls

60 lines (44 loc) · 2.86 KB

electron-vite-react

awesome-vite GitHub stars GitHub issues GitHub license Required Node.JS >= v14.17.0

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

electron-vite-react.gif

Debug

electron-vite-react-debug.gif

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.