Deploy Vue.js on Your Own Server

Push to your branch and Temps takes it from there — static Vue apps built with Vite are served from the dist/ directory with long-lived cache headers, while Nuxt SSR apps run as Node.js containers with automatic HTTPS. No Dockerfile needed.

Quickstart

From your project root, deploy with your preferred package manager:

npx @temps-sdk/cli up

Temps detects a Vite project from its vite.config.js or vite.config.ts, runs its build script, and serves the output. Static apps are live in a few minutes. Nuxt isn't detected; see Nuxt SSR below.

Static Vue (Vite)

With the Vite preset, Temps installs dependencies with the package manager your lockfile points to, runs its build script (for example npm run build), and serves the dist/ output from the Temps proxy, with long-lived cache headers for hashed assets. No container runs for a static app.

Vue CLI projects aren't detected. Choose the Vite preset for them as well, under Project → Settings → Build & deploy → Build → Framework: it runs your build script and serves dist/, which is where Vue CLI writes its output.

Nuxt SSR

Nuxt applications using server-side rendering run as Node.js containers. Choose the Autopack (Node.js) preset (nixpacks-node), with up --preset nixpacks-node or under Project → Settings → Build & deploy → Build → Framework.

Temps runs your build script (nuxt build), but a new Nuxt project has no start script, so tell Temps how to start the server. Add a Procfile to the repository root:

web: node .output/server/index.mjs

A start script with the same command works too.

Environment variables

# Runtime config (Nuxt)
npx @temps-sdk/cli environments vars set NUXT_PUBLIC_API_URL "https://api.example.com" -e production

# Build-time (Vite)
npx @temps-sdk/cli environments vars set VITE_API_URL "https://api.example.com" -e production

SPA routing

Static Vue apps (Vite) use client-side routing, handled automatically by the proxy.

Single-page applications use client-side routing — paths like /about or /dashboard/settings do not correspond to files on disk. The Temps proxy handles this automatically.

When a request arrives for a path that:

• Has no file extension (e.g. /about, not /about.css)
• Does not match any file on disk

…the proxy serves index.html instead, and your client-side router (React Router, Vue Router, etc.) takes over. This works out of the box — you do not need _redirects, vercel.json, or any rewrite rules.

Caching

The Temps proxy sends ETags with static files, so a browser that already has an unchanged file gets 304 Not Modified instead of downloading it again. The proxy doesn't compress static files.

Cache-Control headers are set based on the file path:

Your hashed JS and CSS bundles are cached for a year, while index.html is always revalidated so new deployments are picked up immediately.

Next Steps