배포 타겟 — Vercel, CF Pages, Tauri

Vite SPA 는 그냥 정적 파일 폴더. 정적 파일 + catch-all SPA rewrite 서빙하는 어디든 호스팅 가능. 아래 셋이 거의 모든 현실 시나리오 커버.

Vercel

SPA rewrite 가진 vercel.json 하나, GitHub 에 push, Vercel 이 매 commit 빌드 + 배포. 적합: 취미 프로젝트, 빠른 iteration, 커스텀 도메인, PR 마다 프리뷰 배포. 주의: per-team 가격 빠르게 스케일; 무거운 대역폭에 egress 비용.

Cloudflare Pages

Git repo 연결, 빌드 명령 (npm run build) + 출력 디렉토리 (dist) 설정, 끝. 로컬 테스트엔 Wrangler CLI. 적합: 고대역폭 앱 (Cloudflare 의 egress 가 어떤 규모에도 무료), 글로벌 edge-cached 정적 asset. 주의: 무료 tier 빌드 제한; catch-all redirect 주변 디버깅 quirk.

Tauri (desktop)

Vite SPA 가 네이티브 desktop 앱의 프런트엔드 됨. Tauri 2.0 가 Rust 코어로 감싸고 진짜 바이너리 (macOS .dmg, Windows .msi, Linux deb/rpm/AppImage) 출하. 적합: OS 통합 필요, 오프라인-first, 서버 런타임 없는 앱. 정확히 다가올 Cinder 퀘스트 (Rust + Tauri + cwkCinder optional boss) 가 살 자리.

SPA rewrite 룰

모든 정적 호스트가 알아야: /conversations/abc 요청 들어오고 그 경로에 파일 없으면 /index.html 서빙해서 React Router 가 인계. 각 호스트가 자기 문법 — Vercel 은 vercel.json, CF Pages 는 _redirects, Netlify 는 _redirects, Tauri 는 필요 없음 (서버 없음).

배포 타겟을 앱이 실제로 하는 거로 골라. Public 마케팅 사이트 → Vercel. 고대역폭 사용자 컨텐츠 → Cloudflare. 네이티브 desktop / Tauri → Tauri 툴체인. 친숙도로 고르지 마; fit 으로 골라.

Code

vercel.json — SPA catch-all rewrite·json

{
  "buildCommand": "npm run build",
  "outputDirectory": "dist",
  "rewrites": [
    { "source": "/(.*)", "destination": "/index.html" }
  ]
}

public/_redirects — Cloudflare Pages / Netlify SPA rewrite·text

# SPA 라우팅용 단일 줄 catch-all.
# Vite 가 public/ 파일을 dist/ 로 as-is 복사.
/*  /index.html  200

Tauri 2.0 — Vite 앱을 네이티브 desktop 으로 감싸기·bash

# 기존 Vite 프로젝트에 Tauri 추가.
npm create tauri-app@latest --template vanilla
# 또는 기존 프로젝트: @tauri-apps/cli 추가, `tauri init` 돌림,
# 'distDir' 를 본인 Vite dist/ 가리키게.

# Dev — Vite + Tauri 같이 돌고, 네이티브 윈도우 열림
npm run tauri dev

# Build — 네이티브 installer 생산
npm run tauri build
# → src-tauri/target/release/bundle/*

Exercise

타겟 하나 골라. Vercel: bootstrap 프로젝트를 GitHub 에 push, vercel.com 에서 연결, 위 vercel.json 추가. CF Pages: 같은 흐름 + public/_redirects 파일. Tauri: npm create tauri-app@latest + React 템플릿 선택, npm run tauri dev. 셋 다 목표 같음 — Vite 앱이 dev server 밖에서 돌고 어딘가에서 접근 가능.

Hint

Vercel 과 CF Pages 가 Vite 자동 감지. Tauri 의 첫 실행이 Rust 툴체인 다운로드 (1회, 멀티-GB) + 첫 빌드 10+ 분 걸릴 수도.

배포 타겟 — Vercel, CF Pages, Tauri

Vercel

Cloudflare Pages

Tauri (desktop)

SPA rewrite 룰

Code

External links

Exercise

Progress

댓글 0