Next.js Discord

Discord Forum

Nextjs 12 build fails in github actions docker file build

Answered
sir A.d posted this in #help-forum
Open in Discord
sir A.dOP
- the gist of it is that my next app builds successfully locally, builds successfully on github actions, builds successfully inside a docker image build locally, but fails inside a docker image build on github actions (using the same docker file)

- the build fails on github actions with the following webpack error message s

#27 81.13 info  - Collecting page data...
#27 85.01 ReferenceError: File is not defined
#27 85.01     at 79858 (/app/apps/client-dashboard/.next/server/chunks/3161.js:13:21)
#27 85.01     at __webpack_require__ (/app/apps/client-dashboard/.next/server/webpack-runtime.js:25:43)
#27 85.01     at /app/apps/client-dashboard/.next/server/chunks/3161.js:408:96
#27 85.01     at __webpack_require__.a (/app/apps/client-dashboard/.next/server/webpack-runtime.js:89:13)
#27 85.01     at 39598 (/app/apps/client-dashboard/.next/server/chunks/3161.js:391:21)
#27 85.01     at __webpack_require__ (/app/apps/client-dashboard/.next/server/webpack-runtime.js:25:43)
#27 85.01     at /app/apps/client-dashboard/.next/server/pages/dashboard/profile.js:671:116
#27 85.01     at __webpack_require__.a (/app/apps/client-dashboard/.next/server/webpack-runtime.js:89:13)
#27 85.01     at 37097 (/app/apps/client-dashboard/.next/server/pages/dashboard/profile.js:663:21)
#27 85.01     at __webpack_require__ (/app/apps/client-dashboard/.next/server/webpack-runtime.js:25:43)
#27 85.02 
#27 85.02 > Build error occurred
#27 85.03 Error: Failed to collect page data for /dashboard/profile
#27 85.03     at /app/node_modules/.pnpm/next@12.3.4_@babel+core@7.23.0_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/build/utils.js:916:15
#27 85.03     at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
#27 85.03   type: 'Error'
#27 85.03 }
Answered by sir A.d
turns out there was a component down the chain that was importing a value from a file which also happened to be using the browser File api, thus this files would get cause the build process to fail since this api isnt avalilable on node.js

removing any references to variables in that File fixed the issue.
View full answer

5 Replies

sir A.dOP
another relevant part of the message : 
85.02 > Build error occurred
85.03 Error: Failed to collect page data for /dashboard/profile
85.03     at /app/node_modules/.pnpm/next@12.3.4_@babel+core@7.23.0_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/build/utils.js:916:15
85.03     at process.processTicksAndRejections (node:internal/process/task_queues:95:5) {
85.03   type: 'Error'
85.03 }
#attempts made :

- i have tried to comment out the code in the profile page mentioned in the error message but that only results in another page being flagged.
- i have also tried updating the github actions apps to their latest versions but this still didnt help
would like appreciate a second eye that could send me looking in the right direction as to what could be the possible causes of this issue,
sir A.dOP
### notes :

there were not dependancy packages changed/updated from between the time that the build used to be successful and the time that it started throwing this error,
- also as noted above, the docker image build runs successfully locally on macos bigsur,
sir A.dOP
turns out there was a component down the chain that was importing a value from a file which also happened to be using the browser File api, thus this files would get cause the build process to fail since this api isnt avalilable on node.js

removing any references to variables in that File fixed the issue.
Answer