pmndrs / pmndrs/react-postprocessing
Three.js bloom issue with Next.js 14
Nobody has claimed this yet.
- Dominant language
- TypeScript
- Stars
- 1.4k
- Forks
- 134
- Avg merge
- 4m
- Merged PRs (30d)
- 4
Description
I am developing simple three.js project with next.js 14.
I wanted to add bloom effect to specific mesh, so I used selectivebloom (https://react-postprocessing.docs.pmnd.rs/effects/selective-bloom).
But there is issue.
⨯ TypeError: Cannot read properties of undefined (reading 'S') at __webpack_require__ (E:\1_Work_Projects\2025\9.22_Telegram_Pokemon Card\project\.next\server\webpack-runtime.js:33:42) at eval (./src/components/ModelViewer.tsx:9:76) at (ssr)/./src/components/ModelViewer.tsx (E:\1_Work_Projects\2025\9.22_Telegram_Pokemon Card\project\.next\server\app\page.js:118:1) at Object.__webpack_require__ [as require] (E:\1_Work_Projects\2025\9.22_Telegram_Pokemon Card\project\.next\server\webpack-runtime.js:33:42) digest: "2435834722" GET / 500 in 68ms
How can I do?
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start in src/components/ModelViewer.tsx, where the stack trace points to the failing import or setup, and reproduce the error with the reported Next.js 14 and selective-bloom configuration. Compare the server-side loading path with the client-side Three.js setup. Done means the page loads without the webpack TypeError and the selective bloom effect remains usable.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- next.js, react, three.js, typescript
- Domain
- frontend, web-dev
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Needs clarification
- Newbie friendliness
- 42/100