Skip to main content
prefab serve renders a PrefabApp as a self-contained HTML page and serves it locally. This lets you iterate on layouts, styling, and client-side interactions (state, forms, conditionals) without wiring up an MCP server or host application.

Quick Start

Create a Python file that defines a PrefabApp:
app.py
from prefab_ui.app import PrefabApp
from prefab_ui.components import Heading, Text

with PrefabApp(state={"greeting": "Hello"}, css_class="p-6") as app:
    Heading("Hello Prefab")
    Text("This is a local preview.")
Then serve it:
prefab serve app.py
This opens your browser to http://127.0.0.1:5175 with the rendered UI. All client-side behavior works — state binding, SetState/ToggleState actions, ForEach loops, conditional rendering, form submissions. The only thing that won’t work is CallTool, since there’s no MCP server to call back to.

Auto-Discovery

If your file has a single PrefabApp instance, prefab serve finds it automatically. If there are multiple, point to the one you want:
prefab serve app.py:dashboard

Live Reload

Pass --reload to watch for file changes and regenerate the page on save:
prefab serve app.py --reload
This watches all .py files in the same directory as your target file. When a change is detected, it re-executes the module and regenerates the HTML. Refresh your browser to see the update.

Options

FlagDefaultDescription
--port, -p5175Port for the local server
--reload / --no-reload--no-reloadWatch for file changes
If the requested port is in use, prefab serve automatically finds the next available one. See PrefabApp for the full API reference.