Skip to content
Vue hosting

Deploy Vue with history-mode routing that just works

DployHub detects Vue projects built with Vite or @vue/cli-service, runs your build and serves dist as a static site. Because every unknown path falls back to index.html, Vue Router in history mode works on refresh without server rewrites. If you use Nuxt instead, we run it as a Node server.

Deploy your Vue appSee pricing

Free staging (0.25 vCPU · 256 MB · 1 GB) · Live from ₹118.50/month, billed hourly · No servers to manage

What we detect

Sensible Vue defaults, no config files.

When you connect the repository we read it and fill in the build settings below. Every value can be changed in the app’s settings — see build settings.

Runtime
Static site (Caddy)
Port
80
Build command
npm run build
Start command
Served as static files (no start command)
Step by step

Deploy Vue in minutes.

  1. 1

    Use history mode freely

    Keep createWebHistory() in your router. You do not need hash mode; the SPA fallback handles deep links like /account/settings.

  2. 2

    Set build-time variables

    Add VITE_ variables (Vite) or VUE_APP_ variables (Vue CLI) in the Environment variables tab for staging and live.

  3. 3

    Create the app

    In New app pick your repo and branch. Set Folder with your app if the Vue project sits in a subfolder such as frontend.

  4. 4

    Deploy and verify

    Watch vite build in the build logs, then open the staging address and refresh on a nested route to confirm routing.

  5. 5

    Promote to live

    Click Go live. The same built files move to live with no rebuild, and you can attach your domain in the Domains tab.

Tips

Running Vue well in production.

Staging is free

Every app gets a staging copy in a free, lightweight Docker container (0.25 vCPU · 256 MB · 1 GB). It pauses after 7 days without a deploy — one click starts it again.

  • History mode works because of the SPA fallback: any path that is not a file returns /index.html, and Vue Router renders the right view.
  • Add a catch-all route (/:pathMatch(.*)*) with a NotFound component; otherwise mistyped URLs render a blank page instead of a friendly 404.
  • Nuxt is detected as a server framework and started with node .output/server/index.mjs on Node.js 20. For a fully static Nuxt site, use nuxi generate with a small Dockerfile or keep the server.
  • Build-time variables are baked into the bundle and Go live promotes the staging build, so keep VITE_ values identical on both environments and redeploy after changing them.
  • If your Vite config sets base: './' or a sub-path, assets may 404 on nested routes. Leave it as / for root hosting.
Does Vue CLI still work?

Yes. Projects using `@vue/cli-service` are detected and served from `dist`, just like Vite.

Can I host my Vue front end and API together?

Create two apps: a static Vue app and a Node or Python API. Each gets its own staging and live address and domain.

How much does hosting a Vue site cost?

Staging is free. A live static site at the smallest size is ₹118.50 a month, billed hourly while running. See [pricing](/pricing).

Other deploy guides

Ship your Vue app today.

Create an account, connect your repository and get a free staging copy plus a live HTTPS address in minutes.

Start deployingRead the quick start