In this article
Wiremaven package, CLI, and Chrome extension reference
wiremaven has three entry points: package integration inside the project, explicit terminal control through the CLI, and a Chrome extension that leaves the project untouched. This page covers the package and CLI surfaces. The extension-specific guide covers the popup workflow and privacy model.
Choose a workflow path
Pick the path that matches how much control you want over the project and where you want to operate the tunnel.
| Path | Best for | Project changes | Notes |
|---|---|---|---|
| Package | Developers who want framework-aware setup and the viewer overlay. | Yes | Install wiremaven, run wiremaven init, and let the project integration wire the
in-browser review surface. |
| CLI | Terminal-first users and unsupported or custom setups. | No | Use wiremaven-cli when you want manual
commands and explicit session control. |
| Chrome extension | Designers, reviewers, founders, non-Node users, or developers who do not want project edits. | No | Runs from a Chrome popup, still requires your normal local dev server to be running, and does not inject overlays or modify pages. |
For the no-project-modification path, start with the Chrome extension guide. It uses the same relay, but you start the tunnel from the popup instead of the package or CLI.
Package installation
Install wiremaven as a dev dependency when you want the project-integrated path. Supported frameworks: Vite, Astro, Next.js, Webpack, and Rspack. No global binary needed.
npm install -D wiremaven Or using other package managers:
pnpm add -D wiremaven
yarn add -D wiremaven
wiremaven is a zero-config dev-time tool. It belongs in
devDependencies.
Package quickstart
Run the setup wizard once to let wiremaven detect your framework and add the right integration:
npx wiremaven init
The wizard inspects your package.json and framework config
files, then patches the relevant config to add the wiremaven overlay
plugin. The wizard refuses risky rewrites and leaves manual fallback
guidance when it does not recognize the config shape.
Start the dev server
Run your existing dev command as normal. wiremaven hooks in during startup:
npm run dev
When the session is active, the overlay widget shows the public
URL and session status to anyone loading the page, including the
viewer. The agent logs the relay registration to stderr as
structured JSON; the local control API is reachable at
http://127.0.0.1:2999 by default.
Share the public URL
Copy the tunnel URL from the overlay widget and send it to whoever needs to review the build. The viewer sees your live local build through the relay. In the package path, the overlay widget appears in the viewer's browser and shows the session status, viewer count, and a countdown to expiry. The Chrome extension path keeps session state in the popup and does not modify the reviewed page.
Package commands
The wiremaven package exposes CLI commands for setup,
diagnostics, and teardown. These run against the project in the current
directory:
| Command | Description |
|---|---|
| npx wiremaven init | Detect framework and patch the config to add the overlay. Safe to re-run. |
| npx wiremaven init --dry-run | Preview what init would change without writing anything. |
| npx wiremaven init --check | Verify framework detection and integration status without making changes. |
| npx wiremaven doctor | Check installation state, framework config, and relay connectivity. |
| npx wiremaven remove | Reverse the patches applied by init. |
| npx wiremaven remove --dry-run | Preview what remove would undo without writing anything. |
Configuration
npx wiremaven init patches your framework config during
setup, so most projects do not need hand-edited plugin options. When
you customize behavior, pass options to the integration function for
your framework. The import and placement differ per framework:
Vite: import from "wiremaven",
add to plugins: [].
Astro: import wiremavenOverlayAstro from "wiremaven/astro", add to integrations: [].
Next.js: import WiremavenDevOverlay from "wiremaven/next", render it in a root
layout or client component.
Webpack: import wiremavenOverlayWebpack from "wiremaven/webpack", add to plugins: [].
Rspack: import wiremavenOverlayRspack from "wiremaven/rspack", add to plugins: [].
Example for Vite (vite.config.ts):
import { wiremavenOverlay } from "wiremaven";
export default defineConfig({
plugins: [
wiremavenOverlay({
expiresInSeconds: 1800, // 900 (15m) | 1800 (30m) | 3600 (60m)
sessionName: "my-demo", // optional tunnel label
relayBaseUrl: undefined, // override relay endpoint (optional)
autoStartAgent: true, // set false to start the tunnel manually
}),
],
}); | Option | Type | Default | Description |
|---|---|---|---|
| expiresInSeconds | 900 | 1800 | 3600 | 1800 | Session duration: 900 = 15 min, 1800 = 30 min, 3600 = 60 min. |
| sessionName | string | (project name) | Optional label attached to the tunnel session. |
| relayBaseUrl | string | https://relay.wiremaven.com | WebSocket relay endpoint. |
| autoStartAgent | boolean | true | Start the local wiremaven agent when the dev server starts. |
Advanced setups have additional options:
localAppPort, localAppHost,
controlHost, controlPort,
controlApiOrigin, zIndex, and
logLevel. Pass them in the same options object.
Defaults work for most projects.
wiremaven-cli reference
The wiremaven-cli package starts a relay session from
the terminal without touching your project. Use it for unsupported
frameworks, CI environments, or any case where you want explicit control
over when the tunnel opens. The command takes a local port number
and accepts optional flags:
npx wiremaven-cli <port> [options] For example, to share a server on port 3000 with a 30-minute window:
npx wiremaven-cli 3000 --expires 30m --name my-demo The terminal prints the public URL once the relay is ready:
Wiremaven tunnel ready: https://relay.wiremaven.com/p/building-canvas-3827/
Local control API: http://127.0.0.1:2999 Press Ctrl+C to close the session.
Options and flags
All flags apply to npx wiremaven-cli <port>:
| Flag | Default | Description |
|---|---|---|
| --expires | 30m | Session duration. Accepted values: 15m, 30m, 60m. |
| --name | none | Optional label attached to the tunnel session. |
| --local-host | none | Local app host to relay. Without this flag, the
proxy tries 127.0.0.1, localhost, and ::1 in order and uses the first
that responds. |
| --relay-url | https://relay.wiremaven.com | Override the relay endpoint for self-hosted setups. |
| --control-port | 2999 | Port for the local control API. Change this when the default port is in use. |
How it works
All wiremaven paths use the same relay between your local dev server and the public URL. A viewer loads the shared URL, and the relay proxies their requests to your machine through an encrypted WebSocket channel. Overhead on the critical path stays under 200ms.
With the package path, wiremaven injects the overlay widget into the viewer's page. It subscribes to the same event stream and surfaces viewer connections, request outcomes, and failures. The Chrome extension uses that event stream in the popup and leaves the reviewed page untouched.
Sessions are time-bounded. At expiry, the public URL stops accepting new connections and the relay closes.
Session model
Every relay session has a fixed window from the moment it starts. The available windows are 15 minutes, 30 minutes (default), and 60 minutes.
At expiry:
- The public URL stops accepting new connections.
- The relay closes the channel and clears the session record.
- The relay retains no viewer data after expiry.
You cannot extend a session once it starts. Stop the current one
and run the CLI again with the --expires value you want.
The overlay shows a countdown to session expiry. Viewers see the remaining time and a "Session closed" message when the window closes.