Skip to main content

CLI Commands

Hexa CLI command groups:

  • hexa new
  • hexa build
  • hexa add
  • hexa generate

hexa new​

Scaffold a new extension project.

hexa new [name] [--platform chrome,firefox,...]
Argument / OptionValuesNotes
[name]stringPrompted if omitted
--platformchrome, firefox, safari, opera, edge, braveComma-separated list

hexa build​

Compile and generate extension artifacts.

hexa build [--platform chrome] [--mode production] [--target all] [--watch]
OptionValuesDefault
--platformchrome, firefox, safari, opera, edge, bravechrome
--modedevelopment, productionconfig or production
--targetall, ui, content, backgroundall
--verboseflagfalse
--watchflagfalse
--no-auto-open-browserflagauto-launch enabled

Notes:

  • Watch mode is driven by hexa build --watch.
  • There is no separate hexa dev command.
  • In Chrome watch mode, Hexa launches a Chromium-compatible browser automatically with the unpacked extension from dist/chrome/development.
  • Hexa prefers Chromium or Chrome for Testing when available because current branded Google Chrome builds block --load-extension for unpacked extensions.
  • Auto-launch opens chrome://extensions in the dedicated Hexa dev profile.
  • Hexa pre-seeds the extension action as pinned in that dev profile.
  • If the extension is not visible, enable Developer mode there and refresh once.
  • Use --no-auto-open-browser to disable automatic Chrome launch.

Compiler options (hexa-cli.config.json)​

compilerOptions supports Vite-style build flags with Hexa camelCase keys:

KeyTypeNotes
minifyboolean | "esbuild" | "terser"true maps to "esbuild"
cssMinifyboolean | "esbuild" | "lightningcss"CSS minifier strategy
sourceMapboolean | "inline" | "hidden"Mapped to Vite build.sourcemap
terserOptionsobjectUsed only when minify: "terser"

Example profiles:

{
"compilerOptions": {
"minify": false,
"cssMinify": false,
"sourceMap": true,
"terserOptions": {}
},
"environments": {
"production": {
"compilerOptions": {
"minify": "terser",
"cssMinify": "lightningcss",
"sourceMap": false,
"terserOptions": {
"compress": {
"drop_console": true
}
}
}
}
}
}

UI options (hexa-cli.config.json)​

KeyTypeDefaultNotes
ui.parallelBuildbooleantrueRuns managed popup + managed devtools builds in parallel during standard build mode. Set to false to force sequential managed UI builds.

hexa add​

Add feature blocks to an existing project.

add content​

hexa add content <name> <urlList> [--run-at document-idle]

add background​

hexa add background <name> [--allow-multiple]

add ui​

hexa add ui popup [--framework react|vue|svelte|solid]
hexa add ui devtools [--framework react|vue|svelte|solid]
hexa add ui newtab [--framework react|vue|svelte|solid]
hexa add ui sidepane [--framework react|vue|svelte|solid]

--framework overrides the surface's scaffolded framework for this command only. When omitted, it falls back to the project's ui.framework (persisted to hexa-cli.config.json on first managed surface), defaulting to react.

Popup and side panel share the same toolbar action button. Both can be configured at the same time — nothing is deleted — but only one of them opens from a plain toolbar click:

  • Adding popup while sidepane is configured: the toolbar click will open the popup, so the side panel can no longer be opened by that click (it stays reachable via context menu, a keyboard command, or a button inside the popup). Hexa CLI prints this explanation and asks for confirmation before scaffolding the popup.
  • Adding sidepane while popup is configured: the toolbar click keeps opening the popup, so the new side panel won't open from that click either. Hexa CLI prints an informational note and proceeds — no confirmation required.

The confirmation prompt is interactive (TTY) by default. Pass --yes (or -y) to confirm automatically — required in CI or any non-interactive shell, where the command otherwise throws an error explaining how to proceed.

hexa add ui popup --yes # skip the interactive confirmation

add worker​

Scaffold a @Worker class for CPU-bound or DOM-dependent background work.

hexa add worker <name> [--environment compute|dom]
OptionValuesDefaultNotes
--environmentcompute, domcomputedom workers run inside an offscreen document (Chromium) when the build needs DOM APIs (e.g. canvas, WASM helpers requiring a document).

Output: src/background/workers/<name>.worker.ts. The worker's @Worker({ name }) value is automatically suffixed with -worker if not already present, so hexa add worker ocr scaffolds @Worker({ name: 'ocr-worker', ... }).

add view​

Scaffold a content @View shadow-DOM component (an overlay, toast, or floating widget injected into the page).

hexa add view <name>

Output under src/content/ui/<name>/:

  • <name>.view.ts — the @View-decorated HexaView subclass
  • <name>.component.(tsx|vue|svelte) — the framework component
  • <name>.css — shadow DOM styles (imported with ?inline)

The component is scaffolded using the project's ui.framework setting (defaults to react when not configured). The framework choice is project-wide — mixed frameworks within a single extension are not supported.

add handler​

hexa add handler <name> <contentClass>

Shared options for add subcommands:

  • --cwd <path>
  • --dry-run
  • --force
  • --verbose
  • --yes / -y — confirm interactive prompts automatically (required in non-interactive/CI shells when a prompt would otherwise appear, e.g. the popup/sidepane conflict)

hexa generate​

Generate classes and store scaffolds.

generate controller​

hexa generate controller <name> [--namespace value]

generate handler​

hexa generate handler <name> [--namespace value]

generate service​

hexa generate service <name> <context>

Contexts: background, content, general, ui.

generate reducer​

hexa generate reducer <name> <context>

Contexts: background, content.

generate state​

hexa generate state <name> <context>

Requires an existing matching reducer file.

Shared options for generate subcommands:

  • --cwd <path>
  • --dry-run
  • --force
  • --verbose

generate output directories​

CLI schematics commands (hexa generate ... and hexa add handler ...) use fixed source-root directories:

  • controllers: src/background
  • handlers: src/content
  • services: src/services
  • workers (hexa add worker): src/background/workers
  • content views (hexa add view): src/content/ui/<name>

For reducers and state generation, directories are context-based under src/background/store and src/content/store.

Where to go next​