A package to simplify the communication between renderer and node js in Electron applications
MIT License
A package to simplify the communication between renderer and node js in Electron applications
NPM link: @el3um4s/ipc-for-electron
To use the package in a project:
npm i @el3um4s/ipc-for-electron
and then in a file:
import { IPC, generateContextBridge } from "@el3um4s/ipc-for-electron";
Use IPC to create a new API for the renderer process:
import { IPC, SendChannels } from "@el3um4s/ipc-for-electron";
import { BrowserWindow } from "electron";
const nameAPI = "helloWorld";
// to Main
const validSendChannel: SendChannels = {
requestHello: requestHello,
};
// from Main
const validReceiveChannel: string[] = ["getHello"];
const systemInfo = new IPC({
nameAPI,
validSendChannel,
validReceiveChannel,
});
export default helloWorld;
// Enter here the functions for ElectronJS
function requestHello(
mainWindow: BrowserWindow,
event: Electron.IpcMainEvent,
message: any
) {
const result = {
name: "John",
message: "Hello",
};
mainWindow.webContents.send("getHello", result);
}
Add the api to the context bridge to use it in the renderer process. In the preload.ts
file:
import { generateContextBridge } from "@el3um4s/ipc-for-electron";
import helloWorld from "./helloWorld";
const listAPI = [helloWorld];
generateContextBridge(listAPI, "ipc");
In the renderer process, use the API:
globalThis.ipc.helloWorld.send("requestHello", null);
globalThis.ipc.helloWorld.receive("getHello", async (data) => {
const { name, message } = data;
console.log(message, name);
// Hello John
});
System Info: Allow the renderer to get information about the version of Electron, Chrome and NodeJS
Window Controls: Allow the renderer to close, minimize and maximize the window
Chokidar: Allow the renderer to use chokidar (Minimal and efficient cross-platform file watching library)
Auto Updater: Allow the renderer to update electron apps via electron-updater
Electron Window: Create a window with optional autoupdater and browserview