Skip to main content
Skybridge provides two CLI tools: the main skybridge CLI for development and production workflows, and create-skybridge for bootstrapping new projects.

Skybridge CLI

The main CLI is available as both skybridge and sb commands after installing skybridge in your project.

skybridge dev

Start the development server with hot module reloading and DevTools.
skybridge dev
What it does:
  • Starts a development server at http://localhost:3000/
  • Opens DevTools for local testing at http://localhost:3000/
  • Exposes MCP server at http://localhost:3000/mcp
  • Enables file watching with automatic server restart
  • Enables Hot Module Reloading (HMR) for widgets

Flags

FlagDescription
-p, --port <number>Port to run the server on. Defaults to 3000, or the next available port if 3000 is in use.
--use-forwarded-hostUses the forwarded host header to construct widget URLs instead of localhost. Useful when accessing the dev server through a tunnel (e.g., ngrok).
You can also set the port via the PORT environment variable:
PORT=8080 skybridge dev
The flag takes precedence over the environment variable. The --use-forwarded-host allows your widgets to work on any device connected to the internet, not just on your local machine. Useful when developing on multiple devices or when you need to test your app from different devices. Important limitation: Hot Module Reloading (HMR) is not available when using --use-forwarded-host because HMR uses a different port than the dev server and requires the WebSocket Secure (WSS) protocol, which most tunnel solutions don’t support. To see your changes during development, simply reopen the conversation in ChatGPT to refresh the widget. Example with ngrok:
# Terminal 1: Start Skybridge
skybridge dev --use-forwarded-host

# Terminal 2: Expose your local server
ngrok http 3000
Note: Only use --use-forwarded-host when you need to develop or test on multiple devices. For local-only development, the standard skybridge dev command is sufficient. When using --use-forwarded-host, Skybridge will use the ngrok URL (e.g., https://abc123.ngrok-free.app) for widget URLs instead of localhost:3000.

skybridge build

Build your widgets and MCP server for production deployment.
skybridge build
What it does:
  1. Building widgets - Compiles your React widgets using Vite
  2. Compiling server - Transpiles TypeScript server code
  3. Copying static assets - Moves built assets to the dist/ directory
The output is placed in the dist/ directory, ready for production deployment.

skybridge start

Start the production server.
skybridge start
Requirements:
  • Must run skybridge build first
  • Requires dist/index.js to exist
What it does:
  • Runs the compiled server from dist/index.js
  • Sets NODE_ENV=production
  • Serves the MCP endpoint at http://localhost:3000/mcp
  • Serves pre-built widget assets from /assets

create-skybridge

A standalone CLI for bootstrapping new Skybridge projects.
npm create skybridge@latest [directory]
Or with other package managers:
npm create skybridge@latest

Arguments

ArgumentDescription
[directory]Target directory for the new project. If not specified, you’ll be prompted to enter a project name. Use . to create in the current directory.

Options

OptionDescription
-h, --helpShow help message
--overwriteRemove existing files in target directory without prompting
--immediateInstall dependencies and start the development server automatically after scaffolding

Examples

Create a new project interactively:
npm create skybridge@latest
Create a project in a specific directory:
npm create skybridge@latest my-app
Create in current directory, overwrite existing files, and start immediately:
npm create skybridge@latest . --overwrite --immediate

What it creates

The scaffolder copies a starter template that includes:
  • server/index.ts - MCP server with example tools
  • web/ - React widgets with example components
  • package.json - Pre-configured with all dependencies
  • tsconfig.json files - TypeScript configuration
  • vite.config.ts - Vite configuration for widget bundling
  • nodemon.json - File watching configuration for development

Package Manager Scripts

When you create a new Skybridge project, the package.json includes these scripts:
ScriptCommandDescription
devskybridge devStart development server
buildskybridge buildBuild for production
startskybridge startStart production server
Run them with your package manager:
npm run dev
npm run build
npm start