Default hono app doesn't work on vercel

[howagain]

Spent several hours trying to configure the default hono projects to work on vercel and it's a real pain.

First error you get is: https://vercel.com/docs/errors/error-list#missing-public-directory
Then once you say that dist is the output folder or you add a public directory you're still stuck. I tried manually labeling the index.js in src/dist as a function with vercel.json. Using the VERCEL_HELPERS=0. I have gotten the files deployed and it treats them as static files not functions. Seems like you need to put things in /api folder for them to be functions, but then even once I get those invoked with the right path and redirecting the deployment to /api, I get import errors with path resolution. The default hono vercel template has edge runtime working and the vercel template has vercel functions working, but oRPC fails when module resolution isn't node and vercel throws module not found errors when the module resolution is "bundler".

Starting command

bun create better-t-stack@latest my-better-t-app --yes --api orpc --addons biome turborepo --examples ai todo

Docs I've read:
https://vercel.com/docs/functions/functions-api-reference
https://vercel.com/docs/project-configuration
https://vercel.com/docs/functions/runtimes/node-js
https://hono.dev/docs/getting-started/vercel
https://vercel.com/templates/hono/hono-on-vercel

Has anyone been able to figure it out?

[AmanVarshney01]

this demo app is deployed to vercel
https://github.com/AmanVarshney01/my-better-t-app-demo

you can watch this tutorial on how to deploy hono
https://www.youtube.com/watch?v=QDgdUtd6ZRs

[howagain]

Okay this is really useful thank you and the approach makes sense and feels way less hacky. I feel like I'm super close. But there's one new issue that the video doesn't talk about and the repo doesn't seem to have. The function is bundled up to be 5.4MB which seems right to me. But it's just triggering a download of the files contents of /api/index.ts rather than actually running the function.
Have you ever encountered that before?
howagain/video-qa-ts#1

[nirtamir2]

I have the same issue.
I changeed vercel to use apps/server folder and use /dist folder to the deployment - but it did not work. Need to find a way to run dist/srrc/index.js in vercel.

[nirtamir2]

@AmanVarshney01
I also tried to create /apps/server/api/index.ts with

import { handle } from "hono/vercel";

import app from "../src";

const handler = handle(app);

export const GET = handler;
export const POST = handler;
export const PATCH = handler;
export const PUT = handler;
export const OPTIONS = handler;

and vercel.json
like

{
  "rewrites": [
    {
      "source": "/api/(.*)",
      "destination": "/api"
    }
  ],
  "redirects": [{ "source": "/", "destination": "/api", "permanent": false }]
}

Like the example https://github.com/vercel/hono-starter/
and configured in vercel to use the output directory dist and the root directory to apps/server

But I got a runtime error

Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '/var/task/apps/server/src' is not supported resolving ES modules imported from /var/task/apps/server/api/index.js
    at finalizeResolution (node:internal/modules/esm/resolve:269:11)
    at moduleResolve (node:internal/modules/esm/resolve:866:10)
    at moduleResolveWithNodePath (node:internal/modules/esm/resolve:990:14)
    at defaultResolve (node:internal/modules/esm/resolve:1033:79)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:685:12)
    at #cachedDefaultResolve (node:internal/modules/esm/loader:634:25)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:617:38)
    at ModuleLoader.getModuleJobForImport (node:internal/modules/esm/loader:273:38)
    at ModuleJob._link (node:internal/modules/esm/module_job:135:49) {
  code: 'ERR_UNSUPPORTED_DIR_IMPORT',
  url: 'file:///var/task/apps/server/src'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.
Error [ERR_UNSUPPORTED_DIR_IMPORT]: Directory import '/var/task/apps/server/src' is not supported resolving ES modules imported from /var/task/apps/server/api/index.js
    at finalizeResolution (node:internal/modules/esm/resolve:269:11)
    at moduleResolve (node:internal/modules/esm/resolve:866:10)
    at moduleResolveWithNodePath (node:internal/modules/esm/resolve:990:14)
    at defaultResolve (node:internal/modules/esm/resolve:1033:79)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:685:12)
    at #cachedDefaultResolve (node:internal/modules/esm/loader:634:25)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:617:38)
    at ModuleLoader.getModuleJobForImport (node:internal/modules/esm/loader:273:38)
    at ModuleJob._link (node:internal/modules/esm/module_job:135:49) {
  code: 'ERR_UNSUPPORTED_DIR_IMPORT',
  url: 'file:///var/task/apps/server/src'
}
Node.js process exited with exit status: 1. The logs above can help with debugging the issue.

Even though the source did include it:

I also checked the build code and verified that my dist/api/index.js transpile import to import app from "../src/index.js";
What can be the issue?

[AmanVarshney01]

@nirtamir2, would it be possible for you to share the repo?

[nirtamir2]

@nirtamir2, would it be possible for you to share the repo?

You can use:

pnpm create better-t-stack@latest my-better-t-app --yes --frontend tanstack-router native-nativewind --runtime node --api orpc --database postgres --orm prisma --package-manager pnpm --no-git --no-install --examples todo

I want to deploy the server here.
I added some additional files as mentioned in the comment #247 (comment)

[AmanVarshney01]

Sorry, but deploying Hono on Vercel is kind of rough. I couldn't find a solution. :(

[howagain]

For what it’s worth, my solution was using next.js as the backend with better stack and then manually integrating hono as the catch all handler by following this guide. https://hono.dev/docs/getting-started/vercel

…

On Fri, May 23, 2025 at 12:47 PM Aman Varshney ***@***.***> wrote: *AmanVarshney01* left a comment (AmanVarshney01/create-better-t-stack#247) <#247 (comment)> Sorry, but deploying Hono on Vercel is kind of rough. I couldn't find a solution. :( — Reply to this email directly, view it on GitHub <#247 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AOELQYYKPEBSYTCF2JMBPVL275ULDAVCNFSM6AAAAAB43D4EUGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDSMBVGQ3TAMRTGM> . You are receiving this because you authored the thread.Message ID: ***@***.***>

[nirtamir2]

But I want to use tanstack start.
The nextjs preset requires nextjs to be a dependency.
I followed hono official guide #247 (comment)

What do you use to deploy hono for free and without a credit card?