honojs / hono

Web framework built on Web Standards
https://hono.dev
MIT License
20.33k stars 582 forks source link

nextjs app router + nodejs not working #2466

Open rengechan opened 7 months ago

rengechan commented 7 months ago

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 commented 7 months ago

Hi @rengechan

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

alexandrefuente commented 7 months ago

@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 commented 6 months ago

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 commented 4 months ago

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 🤷‍♂️

undesicimo commented 2 months ago

Can report that i am reproducing this too. Implementation is right from getting started

    "@hono/node-server": "^1.12.1",
    "hono": "^4.5.6",
    "next": "14.2.4",

https://hono.dev/docs/getting-started/vercel

import { Hono } from 'hono'
import { handle } from '@hono/node-server/vercel'
import type { PageConfig } from 'next'

export const config: PageConfig = {
  api: {
    bodyParser: false,
  },
}

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

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

export default handle(app)
prettyirrelevant commented 2 months ago

i'm also getting this error using hono & bun.

$ bun ./dist/index.js
Failed to find Response internal state key
Server is running on port 8787

However, running the command bun dev, this log entry does not appear.

package.json

  "scripts": {
    "dev": "tsx watch src/index.ts",
    "build": "tsc",
    "start": "bun ./dist/index.js",
  },
  "dependencies": {
    "@hono/node-server": "^1.12.2",
    "hono": "^4.5.11",
    "mongodb": "^6.8.0",
    "zod": "^3.23.8"
  },
  "devDependencies": {
    "@biomejs/biome": "^1.8.0",
    "@types/node": "^20.11.17",
    "tsx": "^4.7.1"
  }
vincent-thomas commented 1 month ago

Im getting the same error

cif commented 1 month ago

I had moment to return to my hono project core and https://github.com/honojs/middleware/issues/627#issuecomment-2219356454 solved the issue for me.

tl;dr update your dev server script to:

bun run --bun vite vs vite

In my case, only in the docker container was broken, so I had to make an additional "dev:docker" script but working for me now 🎉

jlarmstrongiv commented 3 weeks ago

I am receiving this same error with Deno. Neither switching to react@canary react-dom@canary nor react-dom/server.browser worked for me. Even hono’s JSX renderer had the same error.

Sutikshan commented 5 days ago

I am experiencing this issue on Windows. same setup works fine on Mac. But on Windows I am getting this error - ( have hono, bun, remix vite cloudflare pages setup)

PS C:\Users\61449\MDCode\tess-fs\web> bun run --bun remix vite:dev
Failed to find Response internal state key
Using vars defined in .dev.vars

My source code is in -

https://github.com/Sutikshan/tess-fs