https://github.com/subframe7536/typesafe-electron-ipc
typesafe ipc utils for electron
https://github.com/subframe7536/typesafe-electron-ipc
electron ipc typesafe
Last synced: about 1 year ago
JSON representation
typesafe ipc utils for electron
- Host: GitHub
- URL: https://github.com/subframe7536/typesafe-electron-ipc
- Owner: subframe7536
- License: mit
- Created: 2023-05-27T14:54:16.000Z (about 3 years ago)
- Default Branch: v1
- Last Pushed: 2024-09-03T03:47:18.000Z (almost 2 years ago)
- Last Synced: 2025-04-09T17:02:42.830Z (about 1 year ago)
- Topics: electron, ipc, typesafe
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/typesafe-electron-ipc
- Size: 435 KB
- Stars: 7
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
## typesafe electron ipc
typesafe wrapper for IPC in Electron
### install
```shell
npm i typesafe-electron-ipc
```
```shell
yarn add typesafe-electron-ipc
```
```shell
pnpm add typesafe-electron-ipc
```
v1 rewrite all the codes to reduce the runtime part.
for older version, please install `typesafe-electron-ipc@0.6.8` and see at [v0 branch](https://github.com/subframe7536/typesafe-electron-ipc/tree/v0)
### Quick start
#### Define IpcSchema
the event name is combine the schema's object path
```typescript
import type { DefineIpcSchema, MainSend, RendererFetch, RendererSend } from 'typesafe-electron-ipc/define'
export type IpcSchema = DefineIpcSchema<{
ipcTest: {
msg: RendererFetch
front: RendererSend<[test: { test: number }, stamp: number]>
back: MainSend
no: RendererSend
test: {
deep: RendererFetch
}
}
another: RendererFetch<{ a: number } | { b: string }, string>
}, '::'> // ==> chars that combine the key path, '::' by default, customable
```
#### In main
```typescript
import { BrowserWindow, app } from 'electron'
import { useIpcMain } from 'typesafe-electron-ipc'
import type { IpcSchema } from '../ipc'
const main = useIpcMain()
// all functions are typesafe
app.whenReady().then(() => {
main.send(BrowserWindow.getAllWindows()[0], 'ipcTest::back', true)
})
main.handle('ipcTest::msg', (_, data) => {
return 'return from main'
})
main.on('ipcTest::front', (_, data, stamp) => {
console.log(data, stamp)
})
const clearListener = main.on('ipcTest::no', () => console.log('no parameter'))
clearListener()
main.handle('ipcTest::test::deep', () => {
return 'deep test from main'
})
const clearHandler = main.handle('another', (_, data) => {
console.log(data)
return {
msg: 'receive from main',
data,
}
})
clearHandler() // clear handler
```
#### In preload
```typescript
import { exposeIpcRenderer } from 'typesafe-electron-ipc'
exposeIpcRenderer()
```
#### In renderer
```typescript
import { useIpcRenderer } from 'typesafe-electron-ipc/renderer'
import type { IpcSchema } from '../ipc'
const renderer = useIpcRenderer()
// all functions are typesafe
console.log(await renderer.invoke('ipcTest::msg', 'fetch from renderer'))
console.log(await renderer.invoke('ipcTest::test::deep'))
console.log(await renderer.invoke('another', { a: 1 }))
renderer.send('ipcTest::front', { test: 1 }, Date.now())
renderer.send('ipcTest::no')
const clearListener = renderer.on('ipcTest::back', (_, data) => {
console.log(`send from main process: ${data}`)
})
clearListener()
```
### Example
more usage see in [playground](./playground)
### Custom Serializer
```ts
import { exposeCustomIpcRenderer, useCustomIpcMain } from 'typesafe-electron-ipc'
import type { SerializerOptions } from 'typesafe-electron-ipc'
const options: SerializerOptions = {
serializer: {/* options */}
}
// main
const customMain = useCustomIpcMain(options)
// preload
exposeCustomIpcRenderer(options)
```
## Typesafe EventEmitter
```typescript
import type { TypedEventEmitter } from 'typesafe-electron-ipc'
type Test = {
test: string
version: [data: string, num: number]
downloadUrl: [string]
}
const ee = new EventEmitter() as TypedEventEmitter
// all type safe
ee.on('version', (data, num) => {
console.log(data, num)
})
ee.emit('version', 'emit', 123456)
```