@electrojs/config

Typed configuration contracts for ElectroJS applications.

Documentation: https://electrojs.myraxbyte.dev/

ElectroJS supports a monorepo-style application layout with:

• one root electro.config.ts
• one runtime/ package with runtime.config.ts
• one package per renderer view with view.config.ts

Installation

pnpm add -D @electrojs/config vite typescript

Exports

import { defineElectroConfig, defineRuntimeConfig, defineViewConfig } from "@electrojs/config";

import type { AppConfig, RuntimeConfig, ViewConfig } from "@electrojs/config";

electro.config.ts

import { defineElectroConfig } from "@electrojs/config";

export default defineElectroConfig({
    runtime: "runtime",
    views: ["@views/main", "@views/settings"],
});

AppConfig:

interface AppConfig {
    readonly runtime: string;
    readonly views: readonly string[];
}

• runtime is the package specifier for the runtime package
• views is the explicit list of renderer view package specifiers

ElectroJS documents explicit package configuration as the supported setup instead of single-repo auto-discovery.

runtime.config.ts

import { defineRuntimeConfig } from "@electrojs/config";

export default defineRuntimeConfig({
    entry: "./src/main.ts",
});

RuntimeConfig extends Vite user config and adds:

interface RuntimeConfig extends ViteUserConfig {
    readonly entry: string;
}

• entry points at the Electron main-process entry file inside the runtime package

view.config.ts

import { defineViewConfig } from "@electrojs/config";
import react from "@vitejs/plugin-react";

export default defineViewConfig({
    viewId: "main",
    entry: "./index.html",
    plugins: [react()],
});

ViewConfig extends Vite user config and adds:

interface ViewConfig extends ViteUserConfig {
    readonly viewId: string;
    readonly entry?: string;
    readonly preload?: string;
}

• viewId is the bundled renderer id used by runtime @View({ source: "view:<id>" })
• entry defaults to ./index.html
• preload is optional because ElectroJS usually generates preload entrypoints automatically

Layout

my-app/
├── electro.config.ts
├── pnpm-workspace.yaml
├── package.json
├── runtime/
│   ├── runtime.config.ts
│   └── src/main.ts
└── views/
    ├── main/
    │   ├── view.config.ts
    │   ├── index.html
    │   └── src/main.tsx
    └── settings/

Related Packages

• @electrojs/cli runs dev, generate, build, and preview
• @electrojs/runtime powers the Electron runtime
• @electrojs/renderer powers the renderer bridge and signals APIs