Make Vite support Electron, Node.js, etc.
MIT License
Make Vite support Electron, Node.js, etc.
npm i -D vite-plugin-target
import target from 'vite-plugin-target'
// Electron Renderer
export default {
plugins: [
target({
'electron-renderer': {},
}),
],
}
// Electron Preload
export default {
plugins: [
target({
'electron-preload': {},
}),
],
}
// Electron Main
export default {
plugins: [
target({
'electron-main': {},
}),
],
}
// Node.js
export default {
plugins: [
target({
node: {},
}),
],
}
target(options: Options)
export interface NodeOptions {
/**
* Pass to `config.esbuild.target`
*/
version?: string
}
export interface ElectronOptions extends NodeOptions {
nodeIntegration?: boolean
}
export type Options =
| { node: NodeOptions }
| { 'electron-main': NodeOptions }
| { 'electron-preload': ElectronOptions }
| { 'electron-renderer': ElectronOptions }
For node
electron-main
electron-preload
, the plugin only changes a few preset configurations.
electron-renderer
with nodeIntegration
.
┏————————————————————————————————————————┓ ┏—————————————————┓
│ import { ipcRenderer } from 'electron' │ │ Vite dev server │
┗————————————————————————————————————————┛ ┗—————————————————┛
│ │
│ 1. HTTP(Request): electron module │
│ ————————————————————————————————————————————————> │
│ │
│ │
│ 2. Intercept in load-hook(Plugin) │
│ 3. Generate a virtual ESM module(electron) │
│ ↓ │
│ const { ipcRenderer } = require('electron') │
│ export { ipcRenderer } │
│ │
│ │
│ 4. HTTP(Response): electron module │
│ <———————————————————————————————————————————————— │
│ │
┏————————————————————————————————————————┓ ┏—————————————————┓
│ import { ipcRenderer } from 'electron' │ │ Vite dev server │
┗————————————————————————————————————————┛ ┗—————————————————┛