TanStack Start

1. Установка @cloudflare/vite-plugin и wrangler:

   npmyarnpnpmbun

   npm i @cloudflare/vite-plugin wrangler -- -D

2. Добавьте плагин Cloudflare в конфигурацию Vite:

   vite.config.js

   import { defineConfig } from "vite";
   import { tanstackStart } from "@tanstack/react-start/plugin/vite";
   import { cloudflare } from "@cloudflare/vite-plugin";
   import react from "@vitejs/plugin-react";
   
   export default defineConfig({
   	plugins: [
   		cloudflare({ viteEnvironment: { name: "ssr" } }),
   		tanstackStart(),
   		react(),
   	],
   });

   vite.config.ts

   import { defineConfig } from "vite";
   import { tanstackStart } from "@tanstack/react-start/plugin/vite";
   import { cloudflare } from "@cloudflare/vite-plugin";
   import react from "@vitejs/plugin-react";
   
   export default defineConfig({
   	plugins: [
   		cloudflare({ viteEnvironment: { name: "ssr" } }),
   		tanstackStart(),
   		react(),
   	],
   });

3. Добавьте wrangler.jsonc файл конфигурации:

   {
   	"$schema": "node_modules/wrangler/config-schema.json",
   	"name": "<YOUR_PROJECT_NAME>",
   	// Set this to today's date
   	"compatibility_date": "2026-08-28",
   	"compatibility_flags": ["nodejs_compat"],
   	"main": "@tanstack/react-start/server-entry",
   	"observability": {
   		"enabled": true,
   	},
   }

   "$schema" = "node_modules/wrangler/config-schema.json"
   name = "<YOUR_PROJECT_NAME>"
   # Set this to today's date
   compatibility_date = "2026-08-28"
   compatibility_flags = [ "nodejs_compat" ]
   main = "@tanstack/react-start/server-entry"
   
   [observability]
   enabled = true

4. Обновите scripts раздел в package.json:

   package.json

   {
   	"scripts": {
   		"dev": "vite dev",
   		"build": "vite build",
   		"preview": "vite preview",
   		"deploy": "npm run build && wrangler deploy",
   		"cf-typegen": "wrangler types"
   	}
   }

1. Создайте пользовательский файл точки входа сервера:

   src/server.js

   import handler from "@tanstack/react-start/server-entry";
   
   // Export Durable Objects as named exports
   export { MyDurableObject } from "./my-durable-object";
   
   export default {
   	fetch: handler.fetch,
   
   	// Handle Queue messages
   	async queue(batch, env, ctx) {
   		for (const message of batch.messages) {
   			console.log("Processing message:", message.body);
   			message.ack();
   		}
   	},
   
   	// Handle Cron Triggers
   	async scheduled(event, env, ctx) {
   		console.log("Cron triggered:", event.cron);
   	},
   };

   src/server.ts

   import handler from "@tanstack/react-start/server-entry";
   
   // Export Durable Objects as named exports
   export { MyDurableObject } from "./my-durable-object";
   
   export default {
   	fetch: handler.fetch,
   
   	// Handle Queue messages
   	async queue(batch, env, ctx) {
   		for (const message of batch.messages) {
   			console.log("Processing message:", message.body);
   			message.ack();
   		}
   	},
   
   	// Handle Cron Triggers
   	async scheduled(event, env, ctx) {
   		console.log("Cron triggered:", event.cron);
   	},
   };

2. Обновите конфигурацию Wrangler, чтобы она указывала на вашу пользовательскую точку входа:

   {
   	"main": "src/server.ts",
   }

   main = "src/server.ts"

curl "http://localhost:3000/cdn-cgi/handler/scheduled?cron=*+*+*+*+*"