Vercel Deploy
Deploy the project to Vercel and push all environment variables.
This skill is called by the
orchestrator.
=
or
.
1. Add SPA rewrite rule (Vite only)
Skip this step entirely for Next.js.
If FRAMEWORK = vite — create
at the project root:
json
{
"rewrites": [{ "source": "/(.*)", "destination": "/index.html" }]
}
This prevents 404 errors when users navigate directly to a URL (e.g.
) in a single-page app.
Commit the file before deploying:
bash
git add vercel.json && git commit -m "chore: add Vercel SPA rewrite rule"
2. Set up Vercel
This installs the Vercel CLI if missing, links the project to a Vercel account, and creates a new project if one doesn't exist.
3. Push environment variables
Print the list of keys that need to be added to Vercel:
bash
grep -v '^#' .env.local | grep '=' | cut -d= -f1
Ask the user to add each key to Vercel by running this command for each one — they'll be prompted to paste the value securely:
bash
vercel env add <KEY_NAME> production
If a key already exists on Vercel, the CLI will ask to overwrite — confirm with
.
4. Deploy
5. Update Supabase site_url
Capture the production URL from the deploy output and update
so magic link emails redirect to the live app instead of localhost:
toml
[auth]
site_url = "https://<your-vercel-url>.vercel.app"
additional_redirect_urls = ["http://localhost:5173", "http://localhost:3000"]
Ask the user to push the updated config by running in their terminal:
This ensures magic links work in both local dev and production without any config changes between environments.
6. Validate
After the deploy completes, open the printed live URL and confirm:
- The app loads without a blank screen or error
- The login page is reachable
- Data loads from Supabase
If anything looks wrong, invoke
to inspect the deployment output.
Report: "✓ Deployed. Live at: <URL>"