Viteflow1 · Write
Create the project
Start from the template with bun create and set your staging URL in viteflow.config.ts.1
Compare · Open source starter
Stagepass vs. Viteflow.
Viteflow is a project starter, Stagepass is a CLI plus a loader. Both let you write code locally. They differ in where you look at the result.
The short answer
VfViteflow
Open source starter Made for A new project with Bun and Vite, where a proxied staging copy on localhost is enough.1
SpStagepass
CLI and loader Made for Any build tool and project structure, tested on the real live URL.
Workflow
The same job, step by step.
If you work with Viteflow today, its steps are your usual flow. Next to each one is the same job with Stagepass.
VfWith Viteflow
SpWith Stagepass
Stagepass1 · Write
Code in your own editor
Link a project folder once. It is served at https://my-project.sp with SSL, so you keep your files, Git and build step.4
Viteflow2 · Test
Test through localhost
The dev server proxies your Webflow staging site through localhost and injects the local script.1
Stagepass2 · Test
Test on your real URL
Open the live site with ?stagepass=. Only your browser loads the local files, every visitor keeps production.3
Viteflow3 · Go live
Build, deploy, publish
Build, then paste the file inline, host it on a CDN or upload it as a Webflow asset, and publish the site.1
Stagepass3 · Go live
Ship with your usual deploy
Upload the build to your hosting or CDN and bump data-stagepass-v. No extra publish step for testing.5
Point by point
Side by side.
| Topic | Viteflow | Stagepassthis site |
|---|---|---|
| What it is | Project starterA starter for Webflow development with Bun, Vite and TypeScript.1 | CLI and loaderAn open source CLI and browser loader. Tagged scripts and styles on your Webflow site load from a folder on your Mac, only in your browser.2 |
| Where you write codeSame on both | Your own editorYour own editor, in the Viteflow project.1 | Your own editorYour own editor. The folder you link is served at https://<name>.sp with SSL.4 |
| Where code runs while you test | localhost proxyIts dev server proxies your Webflow staging site through localhost and injects the local script.1 | Your real live URLYour real Webflow URL, only in a browser with an active ?stagepass= session. Visitors keep getting production.3 |
| Setup on the Webflow site | bun create and configCreate a project with bun create, then set your staging URL in viteflow.config.ts.1 | One script and attributesOne loader script in the head code, plus data-stagepass and data-src or data-href on the tags you want to swap.6 |
| Where production files live | Inline, CDN or assetPaste the build inline, host it on a CDN, or upload it as a Webflow asset with an API token.1 | Your hosting or CDNYour own hosting or CDN. The production URL stays in data-src. Stagepass hosts nothing.6 |
| Going live | Build and publishBuild, deploy the file with one of these options, then publish the Webflow site.1 | Your usual deployUpload your build as usual and bump data-stagepass-v so browsers fetch the new file.5 |
| Requirements | BunBun.1 | macOSmacOS, Node.js 18 or newer and Homebrew. Setup installs Caddy, PHP and Dnsmasq.7 |
| License and costSame on both | MIT, freeMIT, as stated in the README.1 | MIT, freeOpen source under the MIT license, free to use.8 |
When each one fits
Pick the tool for the job.
VfPick Viteflow if
- You start a new project
- You like Bun and Vite
- A proxied staging copy on localhost is enough1
SpPick Stagepass if
- You keep your current project and build tool
- You test on the real live URL
- You add local testing to an existing site
Switching
Moving from Viteflow to Stagepass.
Keep the Viteflow project and its build. Stagepass serves the output folder.
- 1Link the build output folder with
stagepass link. - 2Host the production file on your CDN and put its URL in
data-src. - 3Add the Stagepass loader to the head code and tag the script.
Status and sources Checked on · 8 sources
We check every statement on this page against its public source once a month. Each small number in the text points to a source below, with a link to the original page and, where one exists, an archived copy on the Internet Archive.
Stagepass is not affiliated with Viteflow. Tools change over time. If something here is out of date or unfair, open an issue.
- 1 Viteflow README Viteflow github.com
- 2 Stagepass README Stagepass github.com
- 3 Stagepass README, dev mode Stagepass github.com
- 4 Stagepass CLI README Stagepass github.com
- 5 Stagepass MIGRATION.md Stagepass github.com
- 7 Stagepass setup.js Stagepass github.com
- 8 Stagepass LICENSE Stagepass github.com