vite-plugin-electron-renderer

v0.14.6
Support use Node.js API in Electron-Renderer
vite plugin electron renderer

vite-plugin-electron-renderer

简而言之,vite-plugin-electron-renderer 职责是填充 Electron, Node.js 内置模块。

English | 简体中文

原理

加载 Electron、Node.js CJS 包/内置模块/electron (示意图)

 ┏————————————————————————————————————————┓                 ┏—————————————————┓
 │ import { ipcRenderer } from 'electron' │                 │ Vite dev server │
 ┗————————————————————————————————————————┛                 ┗—————————————————┛
                 │                                                   │
                 │ 1. Pre-Bundling electron module into              │
                 │    node_modules/.vite-electron-renderer/electron  │
                 │                                                   │
                 │ 2. HTTP(Request): electron module                 │
                 │ ————————————————————————————————————————————————> │
                 │                                                   │
                 │ 3. Alias redirects to                             │
                 │    node_modules/.vite-electron-renderer/electron  │
                 │    ↓                                              │
                 │    const { ipcRenderer } = require('electron')    │
                 │    export { ipcRenderer }                         │
                 │                                                   │
                 │ 4. HTTP(Response): electron module                │
                 │ <———————————————————————————————————————————————— │
                 │                                                   │
 ┏————————————————————————————————————————┓                 ┏—————————————————┓
 │ import { ipcRenderer } from 'electron' │                 │ Vite dev server │
 ┗————————————————————————————————————————┛                 ┗—————————————————┛

dependencies 与 devDependencies

分类 🌰 dependencies devDependencies
Node.js C/C++ 原生模块 serialport, sqlite3
Node.js CJS 包 electron-store
Node.js ESM 包 execa, got, node-fetch ✅ (推荐)
Web 包 Vue, React ✅ (推荐)

为啥推荐将可以正确构建的包放到 devDependencies 中?

这样做会减小 electron-builder 打包后的应用体积。

npm i vite-plugin-electron-renderer

Metadata

  • MIT
  • Whatever
  • 草鞋没号
  • released 9/20/2024

Downloads

Maintainers