Skip to main content
webstorio dev serves a live preview of your site. It composes each page and component with esbuild, resolves dependencies from the same pinned versions the server uses, and reloads the browser whenever you save a file.
Every configured page is routable at its slug (the home page is /). Header and footer components render around each page, just like production. Dynamic slugs with {param} segments work in preview the same way as on the live site — see Routing.

​
Data modes

Pages can read CMS content, store products, forms, and auth state through the window.webstorio SDK. dev provides that SDK in one of three modes:

empty

Every SDK call resolves to empty results. Great for verifying empty states. Fully offline.

dummy

Returns realistic mock content, products, and forms so you can build against representative data. Fully offline. Default.

preview

Proxies Webstorio’s public API for your subdomain, so the preview reflects your real project data.
Set the default in config, or override per run:
preview mode requires the project to exist (push at least once). empty and dummy need nothing but the CLI.

​
Live reload

The dev server watches pages/**, components/**, and webstorio.config.ts. Saving any file recompiles the affected module and reloads the browser. If a file has a compile error, the preview shows the error message instead of a blank page.

​
Fidelity

The local preview mirrors production closely (same React/dependency versions, same header/body/footer composition), but it is not the authoritative build. The final HTML is always produced by the server on push. See webstorio dev options and dev config for the full reference.