跳到正文
DEV Community· VeloxaHost·· 6 小時前AI 評分62

如何將 Lovable、Bolt 或 v0 建置的應用程式部署到自有網域(附設定檔)

How to host a Lovable, Bolt or v0 app on your own domain (configs included)

AI 導讀

VeloxaHost 整理了將 Lovable、Bolt 或 v0 匯出的應用程式部署到自有網域的設定,涵蓋靜態網站、Vite 單頁應用程式及 Next.js。

正文

VeloxaHost

You built an app in Lovable, Bolt or v0, clicked export, and now you have a zip or a GitHub repo. Getting it onto your own domain is where most people get stuck — blank pages, routes that 404 on refresh, env vars that vanish.

We collected the configs we use into an open-source repo: veloxahost/host-ai-built-apps. Here's the short version.

Step 1: Work out what you actually exported

You have… It is Serve it with
index.html + CSS/JS, no package.json Plain static site Any static file server
package.json with vite Vite single-page app (typical Lovable/Bolt) npm run build, then serve dist/ with an SPA fallback
package.json with next Next.js (typical v0) Node server or Docker

Backend check: if the app uses Supabase (Lovable) or the builder's own auth/database, that part keeps talking to those services. Add your new domain to their allowed origins and redirect URLs before you switch DNS.

Step 2: Serve a Vite app with automatic HTTPS

On any Ubuntu server with your domain's A record pointing at it:

sudo apt install -y caddy
npm ci && npm run build
sudo mkdir -p /var/www/app && sudo cp -r dist/* /var/www/app/

/etc/caddy/Caddyfile:

app.example.com {
    root * /var/www/app
    encode zstd gzip
    try_files {path} /index.html
    file_server
    header /assets/* Cache-Control "public, max-age=31536000, immutable"
    header /index.html Cache-Control "no-cache"
}
sudo systemctl reload caddy

Caddy fetches a Let's Encrypt certificate on the first request. The try_files … /index.html line is the important one: it's what stops /dashboard from 404-ing when someone refreshes.

Step 3: Next.js exports

Set output: "standalone" in next.config.js, then use the multi-stage Dockerfile in the repo:

docker build -t myapp .
docker run -d --restart unless-stopped -p 127.0.0.1:3000:3000 --env-file .env myapp

…and reverse-proxy to it:

app.example.com {
    reverse_proxy 127.0.0.1:3000
}

Step 4: Deploy on every push

The repo includes a GitHub Actions workflow that builds the app (if there's a package.json) and rsyncs it to your server. Add DEPLOY_HOST, DEPLOY_USER and DEPLOY_SSH_KEY as secrets and you're done.

The five problems you'll probably hit

  1. Blank page → the build used a sub-path. Set base: '/' in vite.config.
  2. 404 on refresh → missing SPA fallback (see Step 2).
  3. Env vars missing → Vite only exposes VITE_* vars, baked in at build time. Rebuild after changing them.
  4. Login redirect fails → add the new domain to your auth provider's redirect URLs.
  5. Mixed content → every API URL must be https://.

Where to run it

Any Linux VPS works — the configs aren't tied to a provider. If you want the shortcut: VeloxaHost servers start at $4/mo with snapshots, and Veloxa Build hosts what it builds on every plan.

Disclosure: we build VeloxaHost and Veloxa Build. The repo is MIT-licensed and provider-neutral — PRs welcome.

來源:DEV Community · dev.to