Hosting is the process of deploying your application to the internet so that users can access it. This is a critical part of any web development project, ensuring your application is available to the world. TanStack Start is built on Vite, a powerful dev/build platform that allows us to make it possible to deploy your application to any hosting provider.
TanStack Start is designed to work with any hosting provider, so if you already have a hosting provider in mind, you can deploy your application there using the full-stack APIs provided by TanStack Start.
However, since hosting is one of the most crucial aspects of your application's performance, reliability, and scalability, we recommend using one of our Official Hosting Partners: Cloudflare or Netlify.
Warning
The page is still a work in progress. We'll keep updating this page with guides on deployment to different hosting providers soon!
Once you've chosen a deployment target, you can follow the deployment guidelines below to deploy your TanStack Start application to the hosting provider of your choice:
When deploying to Cloudflare Workers, you'll need to complete a few extra steps before your users can start using your app.
pnpm install @cloudflare/vite-plugin -D
pnpm install @cloudflare/vite-plugin -D
Add the cloudflare plugin to your vite.config.ts file.
// vite.config.ts
import { defineConfig } from 'vite'
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { cloudflare } from '@cloudflare/vite-plugin'
import viteReact from '@vitejs/plugin-react'
export default defineConfig({
plugins: [
cloudflare({ viteEnvironment: { name: 'ssr' } }),
tanstackStart(),
viteReact(),
],
})
// vite.config.ts
import { defineConfig } from 'vite'
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { cloudflare } from '@cloudflare/vite-plugin'
import viteReact from '@vitejs/plugin-react'
export default defineConfig({
plugins: [
cloudflare({ viteEnvironment: { name: 'ssr' } }),
tanstackStart(),
viteReact(),
],
})
pnpm add wrangler -D
pnpm add wrangler -D
{
"$schema": "node_modules/wrangler/config-schema.json",
"name": "tanstack-start-app",
"compatibility_date": "2025-09-02",
"compatibility_flags": ["nodejs_compat"],
"main": "@tanstack/react-start/server-entry",
"vars": {
"MY_VAR": "Hello from Cloudflare"
}
}
{
"$schema": "node_modules/wrangler/config-schema.json",
"name": "tanstack-start-app",
"compatibility_date": "2025-09-02",
"compatibility_flags": ["nodejs_compat"],
"main": "@tanstack/react-start/server-entry",
"vars": {
"MY_VAR": "Hello from Cloudflare"
}
}
{
"scripts": {
"dev": "vite dev",
"build": "vite build && tsc --noEmit",
"start": "node .output/server/index.mjs",
// ============ š add this line ============
"deploy": "wrangler deploy"
}
}
{
"scripts": {
"dev": "vite dev",
"build": "vite build && tsc --noEmit",
"start": "node .output/server/index.mjs",
// ============ š add this line ============
"deploy": "wrangler deploy"
}
}
pnpm run build && pnpm run deploy
pnpm run build && pnpm run deploy
Deploy your application to Cloudflare Workers using their one-click deployment process, and you're ready to go!
A full TanStack Start example for Cloudflare Workers is available here.
Install and add the @netlify/vite-plugin-tanstack-start plugin, which configures your build for Netlify deployment and provides full Netlify production platform emulation in local dev.
// vite.config.ts
import { defineConfig } from 'vite'
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import netlify from '@netlify/vite-plugin-tanstack-start'
import viteReact from '@vitejs/plugin-react'
export default defineConfig({
plugins: [tanstackStart(), netlify(), viteReact()],
})
// vite.config.ts
import { defineConfig } from 'vite'
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import netlify from '@netlify/vite-plugin-tanstack-start'
import viteReact from '@vitejs/plugin-react'
export default defineConfig({
plugins: [tanstackStart(), netlify(), viteReact()],
})
Add a netlify.toml file to your project root:
[build]
command = "vite build"
publish = "dist/client"
[build]
command = "vite build"
publish = "dist/client"
Deploy your application using their one-click deployment process, and you're ready to go!
Nitro is an abstraction layer that allows you to deploy TanStack Start applications to a wide range of providers.
ā ļø During TanStack Start 1.0 release candidate phase, we currently recommend using:
ā ļø @tanstack/nitro-v2-vite-plugin is a temporary compatibility plugin for using Nitro v2 as the underlying build tool for TanStack Start. Use this plugin if you experience issues with the Nitro v3 plugin. It does not support all of Nitro v3's features and is limited in its dev server capabilities, but should work as a safe fallback, even for production deployments for those who were using TanStack Start's alpha/beta versions.
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { defineConfig } from 'vite'
import viteReact from '@vitejs/plugin-react'
import { nitroV2Plugin } from '@tanstack/nitro-v2-vite-plugin'
export default defineConfig({
plugins: [
tanstackStart(),
nitroV2Plugin(/*
// nitro config goes here, e.g.
{ preset: 'node-server' }
*/),
viteReact(),
],
})
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { defineConfig } from 'vite'
import viteReact from '@vitejs/plugin-react'
import { nitroV2Plugin } from '@tanstack/nitro-v2-vite-plugin'
export default defineConfig({
plugins: [
tanstackStart(),
nitroV2Plugin(/*
// nitro config goes here, e.g.
{ preset: 'node-server' }
*/),
viteReact(),
],
})
ā ļø The nitro vite plugin is an official BETA plugin from the Nitro team for using Nitro v3 as the underlying build tool for TanStack Start. It is still in development and is receiving regular updates.
This package needs to be installed as follows:
"nitro": "npm:nitro-nightly",
"nitro": "npm:nitro-nightly",
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { defineConfig } from 'vite'
import viteReact from '@vitejs/plugin-react'
import { nitro } from 'nitro/vite'
export default defineConfig({
plugins: [
tanstackStart(),
nitro(/*
// nitro config goes here, e.g.
{ config: { preset: 'node-server' } }
*/)
viteReact(),
],
})
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { defineConfig } from 'vite'
import viteReact from '@vitejs/plugin-react'
import { nitro } from 'nitro/vite'
export default defineConfig({
plugins: [
tanstackStart(),
nitro(/*
// nitro config goes here, e.g.
{ config: { preset: 'node-server' } }
*/)
viteReact(),
],
})
Follow the Nitro deployment instructions. Deploy your application to Vercel using their one-click deployment process, and you're ready to go!
Follow the Nitro deployment instructions. Use the node command to start your application from the server from the build output files.
Ensure build and start npm scripts are present in your package.json file:
"build": "vite build",
"start": "node .output/server/index.mjs"
"build": "vite build",
"start": "node .output/server/index.mjs"
Then you can run the following command to build your application:
npm run build
npm run build
You can start your application by running:
npm run start
npm run start
Important
Currently, the Bun specific deployment guidelines only work with React 19. If you are using React 18, please refer to the Node.js deployment guidelines.
Make sure that your react and react-dom packages are set to version 19.0.0 or higher in your package.json file. If not, run the following command to upgrade the packages:
bun install react@19 react-dom@19
bun install react@19 react-dom@19
Follow the Nitro deployment instructions. Depending on how you invoke the build, you might need to set the 'bun' preset in the Nitro configuration:
// vite.config.ts
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { defineConfig } from 'vite'
import viteReact from '@vitejs/plugin-react'
import { nitroV2Plugin } from '@tanstack/nitro-v2-vite-plugin'
// alternatively: import { nitro } from 'nitro/vite'
export default defineConfig({
plugins: [
tanstackStart(),
nitroV2Plugin({ preset: 'bun' })
// alternatively: nitro( { config: { preset: 'bun' }} ),
viteReact(),
],
})
// vite.config.ts
import { tanstackStart } from '@tanstack/react-start/plugin/vite'
import { defineConfig } from 'vite'
import viteReact from '@vitejs/plugin-react'
import { nitroV2Plugin } from '@tanstack/nitro-v2-vite-plugin'
// alternatively: import { nitro } from 'nitro/vite'
export default defineConfig({
plugins: [
tanstackStart(),
nitroV2Plugin({ preset: 'bun' })
// alternatively: nitro( { config: { preset: 'bun' }} ),
viteReact(),
],
})
Alternatively, you can use a custom server implementation.
We've created an optimized production server that provides intelligent static asset loading with configurable memory management.
Features:
Quick Setup:
Copy the server.ts file from the example in this repository to your project root
Build your application:
bun run build
bun run build
Start the server:
bun run server.ts
bun run server.ts
Configuration:
The server can be configured using environment variables:
# Basic usage
bun run server.ts
# Custom port
PORT=8080 bun run server.ts
# Optimize for minimal memory usage (1MB preload limit)
STATIC_PRELOAD_MAX_BYTES=1048576 bun run server.ts
# Preload only critical assets
STATIC_PRELOAD_INCLUDE="*.js,*.css" \
STATIC_PRELOAD_EXCLUDE="*.map,vendor-*" \
bun run server.ts
# Debug mode with verbose logging
STATIC_PRELOAD_VERBOSE=true bun run server.ts
# Basic usage
bun run server.ts
# Custom port
PORT=8080 bun run server.ts
# Optimize for minimal memory usage (1MB preload limit)
STATIC_PRELOAD_MAX_BYTES=1048576 bun run server.ts
# Preload only critical assets
STATIC_PRELOAD_INCLUDE="*.js,*.css" \
STATIC_PRELOAD_EXCLUDE="*.map,vendor-*" \
bun run server.ts
# Debug mode with verbose logging
STATIC_PRELOAD_VERBOSE=true bun run server.ts
Environment Variables:
Example Output:
š¦ Loading static assets from ./dist/client...
Max preload size: 5.00 MB
š Preloaded into memory:
/assets/index-a1b2c3d4.js 45.23 kB ā gzip: 15.83 kB
/assets/index-e5f6g7h8.css 12.45 kB ā gzip: 4.36 kB
š¾ Served on-demand:
/assets/vendor-i9j0k1l2.js 245.67 kB ā gzip: 86.98 kB
ā
Preloaded 2 files (57.68 KB) into memory
š Server running at http://localhost:3000
š¦ Loading static assets from ./dist/client...
Max preload size: 5.00 MB
š Preloaded into memory:
/assets/index-a1b2c3d4.js 45.23 kB ā gzip: 15.83 kB
/assets/index-e5f6g7h8.css 12.45 kB ā gzip: 4.36 kB
š¾ Served on-demand:
/assets/vendor-i9j0k1l2.js 245.67 kB ā gzip: 86.98 kB
ā
Preloaded 2 files (57.68 KB) into memory
š Server running at http://localhost:3000
For a complete working example, check out the TanStack Start + Bun example in this repository.
Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.
Your weekly dose of JavaScript news. Delivered every Monday to over 100,000 devs, for free.