T
TanStack•2mo ago
xenophobic-harlequin

Deploying to a node-server

I have created a small app with Tanstack Start, everything works well locally and now I want to deploy it to my ubuntu server running node. However, when I build it it builds a dist folder with a client and server folders inside it. But looking at the packages.json file, the start command looks like this: "start": "node .output/server/index.mjs", I don't have any .outputdirectory? If I change it to run the /dist/server/server.js file nothing happens and the program exits immedietly. I have searched the web and here for answers but found none so far.< Grateful for help.
3 Replies
fair-rose
fair-rose•2mo ago
Yes now with RC, they separated nitro on prod build. You get a dist folder, you need to add your own server runtime (nitro, hono, fastify, bun.server, etc...) see here for more details: https://discord.com/channels/719702312431386674/1420419411679907871
xenophobic-harlequin
xenophobic-harlequinOP•2mo ago
I am not exactly sure on how to do that. I mean, I know how to use hono etc but that thread doesn't tell me that much Got a working example now: 
#!/usr/bin/env node

import { Hono } from "hono";
import { serve } from "@hono/node-server";
import { serveStatic } from "@hono/node-server/serve-static";
import server from "./dist/server/server.js";

const app = new Hono();

// Serve built client assets
app.use("/assets/*", serveStatic({ root: "./dist/client" }));
app.use("/favicon.ico", serveStatic({ root: "./dist/client" }));
app.use("/", serveStatic({ root: "./dist/client" }));

// Let TanStack Start handle everything else (server routes, SSR, server functions)
app.all("*", async (c) => {
  try {
    const response = await server.fetch(c.req.raw);
    return response;
  } catch (error) {
    console.error("Server error:", error);
    return c.text("Internal Server Error", 500);
  }
});

const port = Number(process.env.PORT) || 3000;
const hostname = process.env.HOST || "0.0.0.0";

console.log(`🚀 Server running at http://${hostname}:${port}`);

serve({
  fetch: app.fetch,
  port,
  hostname,
});
#!/usr/bin/env node

import { Hono } from "hono";
import { serve } from "@hono/node-server";
import { serveStatic } from "@hono/node-server/serve-static";
import server from "./dist/server/server.js";

const app = new Hono();

// Serve built client assets
app.use("/assets/*", serveStatic({ root: "./dist/client" }));
app.use("/favicon.ico", serveStatic({ root: "./dist/client" }));
app.use("/", serveStatic({ root: "./dist/client" }));

// Let TanStack Start handle everything else (server routes, SSR, server functions)
app.all("*", async (c) => {
  try {
    const response = await server.fetch(c.req.raw);
    return response;
  } catch (error) {
    console.error("Server error:", error);
    return c.text("Internal Server Error", 500);
  }
});

const port = Number(process.env.PORT) || 3000;
const hostname = process.env.HOST || "0.0.0.0";

console.log(`🚀 Server running at http://${hostname}:${port}`);

serve({
  fetch: app.fetch,
  port,
  hostname,
});
sunny-green
sunny-green•2mo ago
updated the hosting section: https://tanstack.com/start/latest/docs/framework/react/hosting#nitro
Hosting | TanStack Start React Docs
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...

Did you find this page helpful?