Vite EVP

Vite EVP means Vite Electron-Vue-Python. This is a template for electron application, using Vue for rendering UI, and python as backend.

Vite is used as bundler (instead of webpack). electron-builder is used for building. gRPC is used to expose python APIs to electron (but you don't need to understand gRPC). Ant-Design of Vue is used as the UI components.

Thanks to Alex Kozack, I started this template based on his vite-electron-builder.

Installation

• Environment:

  • Node.js >= 16.14.2
  • Python >= 3.8.10
  • Poetry (A python package manager)

• cd to the project root and run script:

  npm install

  This will install the dependencies for both Node.js and python. And the project is ready to go.

Scripts

• npm run serve

  Run the app in development environment.

• npm run build

  Build executables. The default configs in /electron-builder.config.js will build an .exe installer for windows.

Project Structure

The entire source code of the program is divided into 4 packages that are each bundled independently:

• packages/main: Electron main process.
• packages/preload: Used in BrowserWindow.webPreferences.preload.
• packages/renderer: Electron renderer process.
• packages/backend: A python package, the backend to expose APIs.

RPC (Remote Process Call) between Electron App and python backend