nextjs app router + nodejs not working

[rengechan]

What version of Hono are you using?

4.2.1

What runtime/platform is your app running on?

nodejs

What steps can reproduce the bug?

    "next": "14.1.4",
    "@hono/node-server": "^1.9.1",
    "hono": "^4.2.1",

src\app\api\[[...route]]\route.ts

import { Hono } from 'hono';
import { handle } from '@hono/node-server/vercel';

const app = new Hono().basePath('/api');

app.get('/hello', (c) => {
  return c.json({
    message: 'Hello from Hono!',
  });
});

// export const GET = handle(app);
export default handle(app);

with export const GET = handle(app);

error

 ⨯ TypeError: outgoing.on is not a function
    at eval (webpack-internal:///(rsc)/./node_modules/.pnpm/@hono+node-server@1.9.1/node_modules/@hono/node-server/dist/vercel.mjs:364:14)

with default export export default handle(app);

error

Failed to find Response internal state key
 ⨯ Detected default export in 'F:\code\xxxx\src\app\api\[[...route]]\route.ts'. Export a named export for each HTTP method instead.
 ⨯ No HTTP methods exported in 'F:\code\xxxx\src\app\api\[[...route]]\route.ts'. Export a named export for each HTTP method.

What is the expected behavior?

No response

What do you see instead?

No response

Additional information

No response

[yusukebe]

Hi @rengechan

Hmm. I've tried, but I can't reproduce it. Could you share a minimal project to reproduce it?

[alexandrefuente]

@rengechan, I had the same issue, I was looking for some solution, I have changed the line

import { handle } from '@hono/node-server/vercel'; to import { handle } from 'hono/vercel';

import { Hono } from 'hono';
import { handle } from 'hono/vercel';

const app = new Hono().basePath('/api');

app.get('/hono/:name', async (c) => {
  return c.json({
    message: 'Just a config of Hono backend side GET!'
  });
})

app.post('/hono', async (c) => {
  return c.json({
    message: 'Just a config of Hono backend side POST!'
  });
})

export const GET = handle(app);
export const POST = handle(app);
export default app as never;

Now it is working, but in the terminal still the message. Detected default export in '/src/app/api/[...slug]/route.ts'. Export a named export for each HTTP method instead.

[cif]

I'm working on a client and service gateway project using vite-dev-server plugin and ran into this issue, but it only happens when I run the vite dev server in a docker container (my preferred workflow).

To reproduce, you can clone the repo and bring up the dev container with compose:

git clone git@github.com:stabledata/surface.git
cd surface
docker-compose up dev

This outputs:

[+] Running 1/0
 ✔ Container surface-dev-1  Created                                                                             0.0s 
Attaching to surface-dev-1
surface-dev-1  | $ vite
surface-dev-1  | Failed to find Response internal state key
surface-dev-1  | 
surface-dev-1  | ♻️  Generating routes...
surface-dev-1  | ✅ Processed routes in 353ms
surface-dev-1  | 
surface-dev-1  |   VITE v5.2.8  ready in 1039 ms
surface-dev-1  | 
surface-dev-1  |   ➜  Local:   http://localhost:4000/
surface-dev-1  |   ➜  Network: http://172.18.0.2:4000/
surface-dev-1  | Expected a Response object
surface-dev-1  | Expected a Response object

Note the line after the vite command Failed to find Response internal state key. When you view http://localhost:4000 in a browser you see the Bun default page Get started by returning a [Response](https://developer.mozilla.org/en-US/docs/Web/API/Response) object in fetch(request)

Everything works perfectly fine on the local machine when running bun dev.

Not a huge blocker, I prefer to work in docker-compose but saw someone else reported the error and thought since I had an easy repro would post here.

Thanks for all the work on Hono! As a previous express user love the API! ❤️ 🙏 I've been playing with patterns for dependency injection and just found the factory/Env pattern

[JesseSinivuori]

Just had the same issue when trying to use hono for the first time. I have "next": "^14.2.4", "hono": "^4.4.8","@hono/node-server": "^1.11.4", None of the the documentation examples worked. I tired some other syntaxes like:

//1.
import { Hono } from "hono";
import { handle } from "hono/vercel";

const app = new Hono().basePath("/api");

export const GET = handle(
  app.get("/hello", async (c) => {
    return c.json({
      message: "Hello!",
    });
  })
);

//2.
import { Hono } from "hono";
import { handle } from "hono/vercel";

const app = new Hono().basePath("/api");

app.get("/hello", async (c) => {
  return c.json({
    message: "Hello!",
  });
});

export const GET = handle(app.get());

//3.
import { Hono } from "hono";
import { handle } from "hono/vercel";

const app = new Hono().basePath("/api");

app.get("/hello", async (c) => {
  return c.json({
    message: "Hello!",
  });
});

const handler = handle(app);
export { handler as GET, /* handler as POST ... */ };

all of these worked, and when i went back to the docs example, it was also magically working now 🤷‍♂️