Open moroshko opened 11 months ago
Hi I have fixed the issue please check and review : https://github.com/moroshko/nextjs-pdfmake-issue/pull/1
experiencing the same issue
Same issue here. Trying to use pdfmake
on the server-side makes the route return 404
instead of 200
. Here's the route:
import { writePDF } from "@/src/template/server-side";
import { NextResponse } from "next/server";
export const dynamic = "force-dynamic";
export async function GET(
request: Request, // do not remove
{ params }: { params: { uuid: string } }
) {
// writePDF();
return new NextResponse("OK");
}
This is one big WTF. This doesn't brake on import, but when the function call is uncommented. But the function is never called, since the route automatically goes to 404. There is 0 errors whatsoever.
I can successfully run the function defined in @/src/template/server-side
via ts-node
. This only breaks in Next.js
@Asifdecoder You've literally just removed the function invocation in that PR and you call that a fix?
Did some more digging and found out that next build
produces an error instead of just swallowing it into a 404:
~/dir/web (h2b-layout ✗) pnpm run build
> web@0.1.0 build dir/web
> next build
▲ Next.js 14.0.3
- Environments: .env
✓ Creating an optimized production build
✓ Compiled successfully
✓ Linting and checking validity of types
Collecting page data ..Error: ENOENT: no such file or directory, open 'dir/web/.next/server/app/api/[uuid]/generate/data.trie'
at Object.openSync (node:fs:603:3)
at Object.readFileSync (node:fs:471:35)
at 22318 (dir/web/.next/server/app/api/[uuid]/generate/route.js:1:101599)
at t (dir/web/.next/server/webpack-runtime.js:1:143)
at 96985 (dir/web/.next/server/app/api/[uuid]/generate/route.js:1:234192)
at t (dir/web/.next/server/webpack-runtime.js:1:143)
at 50301 (dir/web/.next/server/app/api/[uuid]/generate/route.js:14:202634)
at t (dir/web/.next/server/webpack-runtime.js:1:143)
at 40620 (dir/web/.next/server/app/api/[uuid]/generate/route.js:14:202784)
at t (dir/web/.next/server/webpack-runtime.js:1:143) {
errno: -2,
syscall: 'open',
code: 'ENOENT',
path: 'dir/web/.next/server/app/api/[uuid]/generate/data.trie'
}
> Build error occurred
Error: Failed to collect page data for /api/[uuid]/generate
at dir/web/node_modules/.pnpm/next@14.0.3_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/build/utils.js:1217:15
at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
type: 'Error'
}
Collecting page data . ELIFECYCLE Command failed with exit code 1.
Which in turn has lead here to this PDFKit issue: https://github.com/bpampuch/pdfmake/issues/2455
Which then leads to a 4 year old webpack example... this is still a bug on Next.js side, as a route compilation failure should not go to a 404, but to fix our problem with pdfmake
seems like we're gonna need a custom webpack
@moroshko If you're interested I have a working sample for client-side, was going for server-side as it's much easier to get custom fonts done
Same issue here using nextjs@14
route handlers.
import PdfMake from "pdfmake";
export async function GET() {
const pdfMake = new PdfMake({});
console.log(pdfMake);
return Response.json({ data: "ok" });
}
This will return a 404 page on nextjs. However if i remove const pdfMake = new PdfMake({});
the route handlers correctly displays the json response.
At this point i feel like this is a problem with nextjs.
Let's hope this gets fixed asap.
I'm getting the same error when I try to call a grpc service client. This is a bizarre error. Please fix this!
Has anyone gotten this to work?
+1
Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!
Anyone has an idea? I'm getting this issue with @project-serum/anchor
I had same issue with importing pdf-parse package, api routes were returning 404 with no error in the console whatsoever. Finally I thought of trying to 'next build' and then error came up. This is terrible for debugging, why shouldn't those error come up in dev?
I had same issue with importing pdf-parse package, api routes were returning 404 with no error in the console whatsoever. Finally I thought of trying to 'next build' and then error came up. This is terrible for debugging, why shouldn't those error come up in dev?
Please how did you fix this, I'm having the same error right now with pdf-parse
If anyone has figured out how to get past this error in next.js, I would appreciate the info.
If anyone has figured out how to get past this error in next.js, I would appreciate the info.
This happens because the package you use, or function throws an error, but Next js does not actually show the error and just returns 200 for some odd reason. Maybe that helps you.
If anyone has figured out how to get past this error in next.js, I would appreciate the info.
This happens because the package you use, or function throws an error, but Next js does not actually show the error and just returns 200 for some odd reason. Maybe that helps you.
Hello, sorry for the late reply, just seeing this. I actually just decided to do the whole extraction thing on an express api with pdf-parse. Works perfectly
If anyone has figured out how to get past this error in next.js, I would appreciate the info.
This happens because the package you use, or function throws an error, but Next js does not actually show the error and just returns 200 for some odd reason. Maybe that helps you.
Hello, sorry for the late reply, just seeing this. I actually just decided to do the whole extraction thing on an express api with pdf-parse. Works perfectly
well yeah express does work. just wonder why next js throws a 200 when theres an error and shows no error. very stupid.
If anyone has figured out how to get past this error in next.js, I would appreciate the info.
This happens because the package you use, or function throws an error, but Next js does not actually show the error and just returns 200 for some odd reason. Maybe that helps you.
Hello, sorry for the late reply, just seeing this. I actually just decided to do the whole extraction thing on an express api with pdf-parse. Works perfectly
well yeah express does work. just wonder why next js throws a 200 when theres an error and shows no error. very stupid.
Haha, the life :)
Did some digging into this, the reason it happens is that the library throw an error in the module scope, specifically it's a file reading error where error.code
is 'ENOENT'
. In Next.js we handle error.code === 'ENOENT'
for legacy reasons, specifically backwards compat with older versions of Next.js. A simplified reproduction is this:
// app/api/hello/route.js
const err = new Error("test");
err.code = "ENOENT";
throw err;
export async function GET() {
try {
return Response.json({ message: "ok" });
} catch (error) {
return Response.json({ error: "something went" });
}
}
The reason it happens with:
import PdfPrinter from "pdfmake";
export async function GET() {
try {
const printer = new PdfPrinter({});
return Response.json({ message: "ok" });
} catch (error) {
return Response.json({ error: "something went" });
}
}
But doesn't happen with:
import PdfPrinter from "pdfmake";
export async function GET() {
try {
// const printer = new PdfPrinter({});
return Response.json({ message: "ok" });
} catch (error) {
return Response.json({ error: "something went" });
}
}
Is that webpack will shake the pdfmake import as it's unused, so the error doesn't happen as the code doesn't run.
Because of that another way to reproduce is just logging the package without using it any other way:
import PdfPrinter from "pdfmake";
console.log(PdfPrinter)
export async function GET() {
try {
return Response.json({ message: "ok" });
} catch (error) {
return Response.json({ error: "something went" });
}
}
Will check with the team what the best way forward is, in some other places the code
is stripped when it's know to be application code.
Ahhhh, I see... I guess you guys would have to fix the way web pack handles it then. Thanks for the clarification.
I have the same problem, has anyone found a solution yet?
Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!
I have the same issue
Edit by maintainer bot: Comment was automatically minimized because it was considered unhelpful. (If you think this was by mistake, let us know). Please only comment if it adds context to the issue. If you want to express that you have the same problem, use the upvote 👍 on the issue description or subscribe to the issue for updates. Thanks!
I'm currently getting this error and stuck. I can't find a solution.
I literally just have this:
src/app/webhooks/paddle/route.ts
export async function POST() {
console.log('paddle webhook');
}
I even tried changing it to GET too, but every time I send a request to localhost:3000/webhooks/paddle
I get 404 and I don't see the log.
EDIT:
I tried adding a GET handler in there and then opened endpoint in chrome, to my amusement it worked. However, when I tried to send a GET request to the same endpoint using postman, it fails with 404 error.
I tried deploying it on vercel, and I can see that hitting the endpoint returns 404
EDIT:
Figured it out, it's because of middleware.ts
, weird part is, I don't know why it's returning 404, because it should have returned something else.
i use this code, it's work
/** @type {import('next').NextConfig} */
const nextConfig = {
experimental: {
serverComponentsExternalPackages: ["pdf-parse"],
},
};
module.exports = nextConfig;
i use this code, it's work
/** @type {import('next').NextConfig} */ const nextConfig = { experimental: { serverComponentsExternalPackages: ["pdf-parse"], }, }; module.exports = nextConfig;
This solved the issue, thank you!
Link to the code that reproduces this issue
https://github.com/moroshko/nextjs-pdfmake-issue
To Reproduce
git clone https://github.com/moroshko/nextjs-pdfmake-issue.git
cd nextjs-pdfmake-issue
bun i
bun dev
http://localhost:3000/api/hello
Current vs. Expected behavior
Expected: 200 Actual: 404
Verify canary release
Provide environment information
Which area(s) are affected? (Select all that apply)
App Router, Middleware / Edge (API routes, runtime)
Additional context
The following route handler returns a 404 when navigating to
http://localhost:3000/api/hello
:app/api/hello/route.ts
Commenting out
const printer = new PdfPrinter({});
solves the issue (200 is returned, as expected).Here is the 404 response body:
NEXT-3259