Template
Rami BitarandClaude Opus 5.5
55423c7204
Vercel served 404s: with Hydrogen gone it treated the app as a static Vite site, but TanStack Start's build has no index.html; pages come from its server. Add the hosting adapter TanStack documents for Vercel: - nitro() in vite.config, for 'vite build' only (dev and the nodesandbox runtime never load it); on Vercel it writes .vercel/output with the static assets and one Node.js function running Start + Hono - vercel.json: tanstack-start preset, Yarn 4 via Corepack - 'yarn start' runs the Node build; canonical URLs use the Vercel domain Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
38 lines
1.4 KiB
JavaScript
38 lines
1.4 KiB
JavaScript
import { defineConfig } from 'vite';
|
|
import { tanstackStart } from '@tanstack/react-start/plugin/vite';
|
|
import react from '@vitejs/plugin-react';
|
|
import tailwindcss from '@tailwindcss/vite';
|
|
import { fileURLToPath, URL } from 'node:url';
|
|
|
|
// Absolute origin for canonical and Open Graph URLs. Inlined at build time so
|
|
// the server render and the client agree on it. On Vercel the production domain
|
|
// is used automatically; VITE_SITE_URL overrides it anywhere.
|
|
const siteUrl =
|
|
process.env.VITE_SITE_URL ??
|
|
(process.env.VERCEL_PROJECT_PRODUCTION_URL
|
|
? `https://${process.env.VERCEL_PROJECT_PRODUCTION_URL}`
|
|
: 'http://localhost:3000');
|
|
|
|
export default defineConfig(async ({ command }) => ({
|
|
server: { port: 3000 },
|
|
plugins: [
|
|
// Start must come before the React plugin.
|
|
tanstackStart(),
|
|
// Hosting adapter for `vite build`: Nitro packages Start's server for the
|
|
// host (a Vercel Function when building on Vercel, a Node server in
|
|
// .output/ elsewhere). Dev never loads it, so `vite dev` — and the
|
|
// nodesandbox runtime — run plain Vite + TanStack Start + Hono.
|
|
...(command === 'build' ? [(await import('nitro/vite')).nitro()] : []),
|
|
react(),
|
|
tailwindcss(),
|
|
],
|
|
define: {
|
|
'import.meta.env.VITE_SITE_URL': JSON.stringify(siteUrl),
|
|
},
|
|
resolve: {
|
|
alias: {
|
|
'@': fileURLToPath(new URL('./src', import.meta.url)),
|
|
},
|
|
},
|
|
}));
|