TanStack Start

TanStack Start runs through the same Vite worker as a React application. Your project supplies the Start plugin, route files, and generated route tree.

Install the project packages

Add the framework, router, React, and Vite packages to the project that will run in Startpod:

{
  "type": "module",
  "scripts": {
    "dev": "vite dev --port 3100"
  },
  "dependencies": {
    "@tanstack/react-router": "^1.170.0",
    "@tanstack/react-start": "^1.168.0",
    "react": "^19.2.0",
    "react-dom": "^19.2.0"
  },
  "devDependencies": {
    "@vitejs/plugin-react": "^5.0.0",
    "vite": "^7.0.0"
  }
}

Configure Vite

Put tanstackStart() before the React plugin so it can own routing, SSR, and server-function handling:

import { tanstackStart } from "@tanstack/react-start/plugin/vite"
import viteReact from "@vitejs/plugin-react"
import { defineConfig } from "vite"

export default defineConfig({
  server: { port: 3100 },
  plugins: [tanstackStart(), viteReact()],
})

Mount this file as vite.config.ts together with your src/routes, src/router.tsx, and generated src/routeTree.gen.ts files.

Install and start the app

Complete the quickstart setup, install the mounted dependencies, and start the development server:

const install = await startpod.spawn("npm", ["install"])
if ((await install.exit) !== 0) throw new Error("Install failed")

await startpod.spawn("npm", ["run", "dev"])

The preview uses TanStack Start's real SSR and server-function routes. Edits to route files flow through Vite's update path; adding or removing a route also updates the generated route tree.

Try it in the browser

The example starts automatically. Edit index.tsx and watch TanStack Start update the route beside the editor. The terminal shows its SSR development server output.