Stagepass
GitHub

LOCALonly in your browser

Develop locally. Preview on your live Webflow site.

Write TypeScript or SCSS in your own editor and see it on your real Webflow URL without publishing. Everyone else keeps getting production.

Get started
npm install -g @stagepass/cli
Open source · MITmacOSNode.js 18+loader 2.3.0
www.my-client.com/?stagepass=my-project.sp
A test page with the Stagepass flag and its session card in the top right corner, showing LOCAL, my-project.sp and one file swapped locally
$ stagepass link my-project
Serving this folder at
https://my-project.sp

How it works

From your editor to the live site.

A local SSL proxy serves your files on a .sp domain. A small loader on your Webflow site swaps tagged scripts and styles for your local versions, but only while your session is on.

How Stagepass worksEditor: Your local files, in the editor you like. (stagepass link my-project). .sp domain: Served locally with valid SSL. (https://my-project.sp). Loader: A tiny script in your Webflow head code. (data-stagepass="true"). Live site: Your real Webflow URL, now with local files. (?stagepass=my-project.sp). Only tagged files swap. Without an active session, visitors get production.01EditorYour local files,in the editor you like.stagepass link my-projectserves02.sp domainServed locally withvalid SSL.https://my-project.spHTTPS03LoaderA tiny script in yourWebflow head code.data-stagepass="true"swaps04LOCALLive siteYour real Webflow URL,now with local files.?stagepass=my-project.spOnly tagged files swap. Without an active session, visitors get production.
How Stagepass worksEditor: Your local files, in the editor you like. (stagepass link my-project). .sp domain: Served locally with valid SSL. (https://my-project.sp). Loader: A tiny script in your Webflow head code. (data-stagepass="true"). Live site: Your real Webflow URL, now with local files. (?stagepass=my-project.sp). Only tagged files swap. Without an active session, visitors get production.01EditorYour local files,in the editor you like.stagepass link my-projectserves02.sp domainServed locally withvalid SSL.https://my-project.spHTTPS03LoaderA tiny script in yourWebflow head code.data-stagepass="true"swaps04LOCALLive siteYour real Webflow URL,now with local files.?stagepass=my-project.spOnly tagged files swap.Without an active session,visitors get production.

Three steps

Your first session in minutes.

  1. 01

    Link your folder

    Run setup once, then link the folder with your built files. It is served at https://my-project.sp with valid SSL.

    Terminal
    $ stagepass setup && stagepass start
$ stagepass link my-project
  2. 02

    Add the loader

    Paste one script into Project Settings, Custom Code, Head Code. Then tag the assets you want to swap.

    HTML
    <script data-src="https://cdn.example.com/app.min.js"
  data-stagepass="true"
  data-stagepass-path="js/app.js"></script>
  3. 03

    Open your live URL

    Add the parameter once. The session stays in localStorage while you browse and reload.

    Browser
    https://www.my-client.com/?stagepass=my-project.sp

Always visible

You always know when local code is on.

While a session is active, a small flag sits in the top right corner. Hover it for warnings and errors, click it for the session card and End session. No flag means you see the live site, like every visitor.

Flag showing LOCAL

Local

Tagged files load from my-project.sp. Turn on with ?stagepass=my-project.sp.

Flag showing DEBUG

Debug

Logging only, no files are swapped. Turn on with ?stagepass=debug.

No flag

Off

Production for you and for everyone else. Use ?stagepass=off or End session in the flag card.

Install

Two packages, pinned versions.

The CLI runs on your Mac. The loader runs on your site. The major pin @2 brings fixes without breaking changes.

CLI

Needs macOS, Node.js 18+ and Homebrew. Setup installs Caddy, Dnsmasq and PHP. No Docker.

Terminal
$ npm install -g @stagepass/cli

Loader 2.3.0

One script tag in Head Code, loaded with defer. Safe for production.

Head Code
<script src="https://cdn.jsdelivr.net/npm/@stagepass/loader@2/dist/loader.min.js"></script>

Modules 2.2.0

Load only what you need.

Modules extend the loader. Include them as separate script tags after the loader.

Injector

Inject scripts and styles from code with sp.inject(), one by one or in a batch.

inject.min.js

Cookies

Small helpers to set, read, delete and list cookies: bake, eat, throw, has, list, with optional consent categories.

cookies.min.js

Maintenance

An overlay for visitors while you work. You still see the real page with a session.

maintenance.min.js

All in one

Every module in a single bundle, when you want one tag instead of several.

all.min.js

Security first

Built for live sites with real visitors.

The loader does not allow arbitrary code injection. Read the full security notes in the docs.

Security and CORS

  • Origin whitelist. Local files only from domains ending in .sp, localhost or localhost:*.
  • Production by default. Without an active session, tagged assets keep their production URLs.
  • One source of truth. data-src decides, so scripts never load twice.
  • Quiet logging. Stagepass logs stay silent in production when no session is active. Your own console is untouched.

How Stagepass is built

AI built. Human approved.

Built with AI coding agents and tools, every release reviewed by a human.Open source under MIT. Every line is on GitHub.

View on GitHub

Stop publishing to test.

Link a folder, add one script, open your live URL.

Read Getting started