# Vue hosting for static builds

> Host Vue static builds from Vite or Vue CLI with version history and rollback.

Canonical: https://staticx.site/vue-hosting

## Host Vite or Vue CLI output

StaticX serves the dist folder produced by Vue tooling after the app has been compiled.

## Respect router mode

Vue Router history mode needs fallback behavior; hash mode behaves differently and may not require server fallback.

## Version every Vue release

Each publish keeps the exact Vue build, assets, analytics, and rollback target together.

## Deploy a Vue static build

Build Vue into dist, confirm router behavior, and publish the folder contents as a StaticX release.

1. **Build the Vue app** — Run the Vite or Vue CLI build command and locate the generated dist folder.
2. **Check public path** — Verify asset URLs, router history mode, API endpoints, and 404.html.
3. **Publish the dist contents** — Upload the compiled output and confirm the live page loads on refresh.

## Vue deploys are simple when the built app owns the browser.

Vue static builds are just files after compilation. StaticX gives those files hosting, custom domains, lead capture, and version history.

If the Vue app relies on external APIs, those services stay separate. StaticX hosts the frontend release and records how each version performs.

## Vue hosting checks

- **Router mode** — History mode requires fallback support; hash mode keeps route state after the # fragment.
- **Build-time config** — Environment values are baked into the browser bundle and should never include secrets.
- **Release comparison** — Use StaticX analytics to compare conversion after Vue UI changes.

## FAQ

### Can StaticX host Vue 3 and Vite apps?

Yes. Build the Vue app and upload the dist output root.

### Do Vue Router history routes work?

They can, but you need fallback behavior so direct visits to nested routes load the app shell.

### Can Vue call APIs from a StaticX site?

Yes. Browser-side API calls can target external services configured for public frontend access.

### Can I roll back a Vue deploy?

Yes. Publish each build as a StaticX version and roll back if a release breaks.

[View on staticx.site](https://staticx.site/vue-hosting)