added vercel deployment

This commit is contained in:
Nate Kelley 2025-09-11 17:31:00 -06:00
parent 1718dfba45
commit 75994366eb
No known key found for this signature in database
GPG Key ID: FD90372AB8D98B4F
7 changed files with 21 additions and 8 deletions

1
apps/web/.gitignore vendored
View File

@ -18,3 +18,4 @@ storybook-static
.env.staging .env.staging
.env.dev .env.dev
.env.local .env.local
.vercel

View File

@ -10,6 +10,7 @@
"build:production": "cross-env NODE_OPTIONS=--max-old-space-size=8192 vite build --mode production -- --typecheck", "build:production": "cross-env NODE_OPTIONS=--max-old-space-size=8192 vite build --mode production -- --typecheck",
"build:local": "pnpm prebuild && cross-env NODE_OPTIONS=--max-old-space-size=12288 vite build -- --typecheck --local", "build:local": "pnpm prebuild && cross-env NODE_OPTIONS=--max-old-space-size=12288 vite build -- --typecheck --local",
"build-storybook": "storybook build", "build-storybook": "storybook build",
"log:staging": "WRANGLER_LOG=debug npx wrangler tail --format=pretty --env=staging",
"build:visualize": "npx vite-bundle-visualizer", "build:visualize": "npx vite-bundle-visualizer",
"deploy:dev": "pnpm run build && npx wrangler deploy .output/server/index.mjs --env dev --assets .output/public", "deploy:dev": "pnpm run build && npx wrangler deploy .output/server/index.mjs --env dev --assets .output/public",
"deploy:production": "pnpm run build:production && npx wrangler deploy .output/server/index.mjs --env production --assets .output/public", "deploy:production": "pnpm run build:production && npx wrangler deploy .output/server/index.mjs --env production --assets .output/public",

View File

@ -28,8 +28,8 @@ export const createCspHeader = (isEmbed = false): string => {
return [ return [
// Default directives // Default directives
"default-src 'self'", "default-src 'self'",
// Scripts // Scripts - removed 'unsafe-eval' which can cause hydration issues in Cloudflare
"script-src 'self' 'unsafe-inline' 'unsafe-eval' https://cdn.jsdelivr.net https://*.cloudflareinsights.com https://*.posthog.com https://us-assets.i.posthog.com https://eu-assets.i.posthog.com", "script-src 'self' 'unsafe-inline' https://cdn.jsdelivr.net https://*.cloudflareinsights.com https://*.posthog.com https://us-assets.i.posthog.com https://eu-assets.i.posthog.com",
// Styles // Styles
"style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdn.jsdelivr.net", "style-src 'self' 'unsafe-inline' https://fonts.googleapis.com https://cdn.jsdelivr.net",
// Images // Images

View File

@ -4,9 +4,8 @@ export const htmlCacheHeaders = [
{ httpEquiv: 'Pragma', content: 'cache' }, { httpEquiv: 'Pragma', content: 'cache' },
]; ];
// Only use aggressive no-cache for specific routes that need it // Use less aggressive caching to work better with Cloudflare
export const preventBrowserCacheHeaders = [ export const preventBrowserCacheHeaders = [
{ httpEquiv: 'Cache-Control', content: 'no-cache, no-store, must-revalidate' }, { httpEquiv: 'Cache-Control', content: 'public, max-age=0, must-revalidate' },
{ httpEquiv: 'Pragma', content: 'no-cache' }, { httpEquiv: 'Pragma', content: 'no-cache' },
{ httpEquiv: 'Expires', content: '0' },
]; ];

View File

@ -1,6 +1,7 @@
import { createRootRouteWithContext, HeadContent, Scripts } from '@tanstack/react-router'; import { createRootRouteWithContext, HeadContent, Scripts } from '@tanstack/react-router';
import { ErrorBoundary } from 'react-error-boundary';
import { RootProviders } from '@/context/Providers'; import { RootProviders } from '@/context/Providers';
import { htmlCacheHeaders } from '@/middleware/shared-headers'; import { preventBrowserCacheHeaders } from '@/middleware/shared-headers';
import shareImage from '../assets/png/default_preview.png'; import shareImage from '../assets/png/default_preview.png';
import favicon from '../assets/png/favicon.ico'; import favicon from '../assets/png/favicon.ico';
import { TanstackDevtools } from '../integrations/tanstack-dev-tools/tanstack-devtools'; import { TanstackDevtools } from '../integrations/tanstack-dev-tools/tanstack-devtools';
@ -31,7 +32,7 @@ export const Route = createRootRouteWithContext<AppRouterContext>()({
{ name: 'og:type', content: 'website' }, { name: 'og:type', content: 'website' },
{ name: 'og:locale', content: 'en_US' }, { name: 'og:locale', content: 'en_US' },
{ name: 'og:site_name', content: 'Buster' }, { name: 'og:site_name', content: 'Buster' },
...htmlCacheHeaders, ...preventBrowserCacheHeaders,
], ],
links: [ links: [
{ rel: 'stylesheet', href: appCss }, { rel: 'stylesheet', href: appCss },
@ -55,6 +56,7 @@ function RootDocument({ children }: { children: React.ReactNode }) {
</head> </head>
<body> <body>
<RootProviders>{children}</RootProviders> <RootProviders>{children}</RootProviders>
<TanstackDevtools /> <TanstackDevtools />
<Scripts /> <Scripts />
</body> </body>

View File

@ -14,6 +14,7 @@ const DEFAULT_LAYOUT: LayoutSize = ['230px', 'auto'];
export const Route = createFileRoute('/app')({ export const Route = createFileRoute('/app')({
head: () => { head: () => {
console.log('app head');
return { return {
meta: [...preventBrowserCacheHeaders], meta: [...preventBrowserCacheHeaders],
}; };
@ -21,7 +22,10 @@ export const Route = createFileRoute('/app')({
context: ({ context }) => ({ ...context, getAppLayout }), context: ({ context }) => ({ ...context, getAppLayout }),
beforeLoad: async () => { beforeLoad: async () => {
try { try {
console.log('app beforeLoad - getSupabaseSession');
const { isExpired, accessToken = '' } = await getSupabaseSession(); const { isExpired, accessToken = '' } = await getSupabaseSession();
console.log('app beforeLoad - getSupabaseSession - isExpired', isExpired);
console.log('app beforeLoad - getSupabaseSession - accessToken', accessToken);
if (isExpired || !accessToken) { if (isExpired || !accessToken) {
console.error('Access token is expired or not found'); console.error('Access token is expired or not found');
@ -39,6 +43,7 @@ export const Route = createFileRoute('/app')({
loader: async ({ context }) => { loader: async ({ context }) => {
const { queryClient, accessToken } = context; const { queryClient, accessToken } = context;
try { try {
console.log('app loader - getAppLayout');
const [initialLayout, user] = await Promise.all([ const [initialLayout, user] = await Promise.all([
getAppLayout({ id: PRIMARY_APP_LAYOUT_ID }), getAppLayout({ id: PRIMARY_APP_LAYOUT_ID }),
getSupabaseUser(), getSupabaseUser(),
@ -47,6 +52,8 @@ export const Route = createFileRoute('/app')({
prefetchListDatasources(queryClient), prefetchListDatasources(queryClient),
prefetchGetDatasets(queryClient), prefetchGetDatasets(queryClient),
]); ]);
console.log('app loader - getAppLayout - initialLayout', initialLayout);
console.log('app loader - getAppLayout - user', user);
if (!user) { if (!user) {
console.error('User not found - redirecting to login'); console.error('User not found - redirecting to login');
@ -66,7 +73,10 @@ export const Route = createFileRoute('/app')({
} }
}, },
component: () => { component: () => {
console.log('app component');
const { user, accessToken } = Route.useLoaderData(); const { user, accessToken } = Route.useLoaderData();
console.log('app component - user', user);
console.log('app component - accessToken', accessToken);
return ( return (
<AppProviders user={user} accessToken={accessToken}> <AppProviders user={user} accessToken={accessToken}>

View File

@ -11,7 +11,7 @@ const config = defineConfig(({ command, mode }) => {
const isTypecheck = process.argv.includes('--typecheck') || process.env.TYPECHECK === 'true'; const isTypecheck = process.argv.includes('--typecheck') || process.env.TYPECHECK === 'true';
const useChecker = !process.env.VITEST && isBuild; const useChecker = !process.env.VITEST && isBuild;
const isLocalBuild = process.argv.includes('--local') || mode === 'development'; const isLocalBuild = process.argv.includes('--local') || mode === 'development';
const target = isLocalBuild ? ('bun' as const) : ('cloudflare-module' as const); const target = isLocalBuild ? ('bun' as const) : ('vercel' as const);
return { return {
server: { port: 3000 }, server: { port: 3000 },