diegomura / diegomura/react-pdf
Nextjs 14 - Package @react-pdf/renderer (serverComponentsExtenalPackages or default list) can't be external
- Dominant language
- TypeScript
- Stars
- 16.8k
- Forks
- 1.3k
- Avg merge
- 5h 6m
- Merged PRs (30d)
- 52
Description
**Describe the bug**
React-PDF is not working with Nextjs 14 and React 18
**To Reproduce**
Steps to reproduce the behavior including code snippet (if applies):
1. Follow the quick start guide.
2. Gets error: TypeError: a.Component is not a constructor
3. Add serverComponentsExternalPackages from Compatibility with Next.js section.
4. Gets error: Package @react-pdf/renderer (serverComponentsExtenalPackages or default list) can't be external
> ⨯ ModuleBuildError: ./node_modules/.pnpm/@react-pdf+renderer@4.3.0_react@18.3.1/node_modules/@react-pdf/renderer/lib/react-pdf.js
> Package @react-pdf/renderer (serverComponentsExtenalPackages or default list) can't be external
> The request @react-pdf/renderer matches serverComponentsExtenalPackages (or the default list), but it can't be external:
> The package seems invalid. require() resolves to a EcmaScript module, which would result in an error in Node.js.
>
>
> at processIssues (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/dev/turbopack-utils.js:229:15)
> at handleRouteType (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/dev/turbopack-utils.js:405:17)
> at async Object.ensurePage (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/dev/hot-reloader-turbopack.js:644:17)
> at async DevBundlerService.ensurePage (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/lib/dev-bundler-service.js:18:20)
> at async DevServer.ensurePage (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/dev/next-dev-server.js:551:9)
> at async Object.ensure (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/dev/next-dev-server.js:169:17)
> at async DevRouteMatcherManager.matchAll (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/future/route-matcher-managers/dev-route-matcher-manager.js:96:13)
> at async DevRouteMatcherManager.match (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/future/route-matcher-managers/default-route-matcher-manager.js:155:26)
> at async NextNodeServer.handleCatchallRenderRequest (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/next-server.js:228:31)
> at async DevServer.handleRequestImpl (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/base-server.js:811:17)
> at async /Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/dev/next-dev-server.js:339:20
> at async Span.traceAsyncFn (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/trace/trace.js:154:20)
> at async DevServer.handleRequest (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/dev/next-dev-server.js:336:24)
> at async invokeRender (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/lib/router-server.js:174:21)
> at async handleRequest (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/lib/router-server.js:353:24)
> at async requestHandlerImpl (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/lib/router-server.js:377:13)
> at async Server.requestListener (/Users/escobar5/Projects/enviaseo/urbanismo/node_modules/.pnpm/next@14.2.1_@babel+core@7.24.5_react-dom@18.3.1_react@18.3.1__react@18.3.1/node_modules/next/dist/server/lib/start-server.js:141:13)
**Expected behavior**
Should render the PDF
**Screenshots**
If applicable, add screenshots to help explain your problem.
**Desktop (please complete the following information):**
- OS: MacOS
- Browser Chromium, Safari, Arc
- React-pdf version 4.3.0
Contributor guide
Assessment
This issue has not been assessed yet.