Back to docs
Recipe

Electron main + preload scaffold

Minimal Electron window with context isolation, preload bridge, and CSP headers — the foundation every Meridian desktop companion starts from.

main.js

const { app, BrowserWindow } = require('electron')
const path = require('path')

function createWindow() {
  const win = new BrowserWindow({
    width: 1200,
    height: 800,
    webPreferences: {
      preload: path.join(__dirname, 'preload.js'),
      contextIsolation: true,
      nodeIntegration: false,
      sandbox: true,
    },
  })

  win.loadFile('index.html')
}

app.whenReady().then(createWindow)

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') app.quit()
})

preload.js

const { contextBridge, ipcRenderer } = require('electron')

contextBridge.exposeInMainWorld('meridian', {
  getVersion: () => ipcRenderer.invoke('get-version'),
  platform: process.platform,
})

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta
    http-equiv="Content-Security-Policy"
    content="default-src 'self'; script-src 'self'"
  />
  <title>Meridian Companion</title>
</head>
<body>
  <div id="root"></div>
  <script src="renderer.js"></script>
</body>
</html>

Security note: contextIsolation is non-negotiable. Never set nodeIntegration true in production. The preload script is your only bridge — keep its surface minimal.