Next.js Discord

Discord Forum

next.js deployment problem

Answered
Giant Chinchilla posted this in #help-forum
Open in Discord
Giant ChinchillaOP
so i've just deployed my blog to vercel and it's failed to deploy how do i fix the problem?
Answered by Giant Chinchilla
nvm i solved the issue, downgraded next.js to version 13.4.4 and changed portcss and autoprefixer into dependencies rather than dev devpendencies
View full answer

29 Replies

Giant ChinchillaOP
RangeError: Maximum call stack size exceeded
    at P (/vercel/path0/.next/server/chunks/403.js:5:187952)
    at l (/vercel/path0/.next/server/chunks/403.js:5:183143)
    at /vercel/path0/.next/server/chunks/403.js:5:184344
    at Array.forEach (<anonymous>)
    at /vercel/path0/.next/server/chunks/403.js:5:184317
    at Array.forEach (<anonymous>)
    at a (/vercel/path0/.next/server/chunks/403.js:5:184137)
    at /vercel/path0/.next/server/chunks/403.js:5:184401
    at Array.forEach (<anonymous>)
    at l (/vercel/path0/.next/server/chunks/403.js:5:184094)
Error occurred prerendering page "/nav". Read more: https://nextjs.org/docs/messages/prerender-error
RangeError: Maximum call stack size exceeded
    at P (/vercel/path0/.next/server/chunks/403.js:5:187952)
    at l (/vercel/path0/.next/server/chunks/403.js:5:183143)
    at /vercel/path0/.next/server/chunks/403.js:5:184344
    at Array.forEach (<anonymous>)
    at /vercel/path0/.next/server/chunks/403.js:5:184317
    at Array.forEach (<anonymous>)
    at a (/vercel/path0/.next/server/chunks/403.js:5:184137)
    at /vercel/path0/.next/server/chunks/403.js:5:184401
    at Array.forEach (<anonymous>)
    at l (/vercel/path0/.next/server/chunks/403.js:5:184094)
RangeError: Maximum call stack size exceeded
    at P (/vercel/path0/.next/server/chunks/403.js:5:187570)
    at l (/vercel/path0/.next/server/chunks/403.js:5:183143)
    at /vercel/path0/.next/server/chunks/403.js:5:184344
    at Array.forEach (<anonymous>)
    at /vercel/path0/.next/server/chunks/403.js:5:184317
    at Array.forEach (<anonymous>)
    at a (/vercel/path0/.next/server/chunks/403.js:5:184137)
    at /vercel/path0/.next/server/chunks/403.js:5:184401
    at Array.forEach (<anonymous>)
    at l (/vercel/path0/.next/server/chunks/403.js:5:184094)
Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
RangeError: Maximum call stack size exceeded
    at P vercel/path0/.next/server/chunks/403.js:5:
i think its a dependency problem...
package.json...
{
  "name": "myapp",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@emotion/react": "^11.11.1",
    "@emotion/styled": "^11.11.0",
    "@heroicons/react": "^2.0.18",
    "@material-tailwind/react": "^2.1.2",
    "@mui/material": "^5.14.12",
    "next": "13.5.4",
    "react": "^18",
    "react-dom": "^18",
    "tailwindcss": "^3.3.3"
  },
  "devDependencies": {
    "@types/node": "^20",
    "@types/react": "^18",
    "@types/react-dom": "^18",
    "autoprefixer": "^10",
    "eslint": "^8",
    "eslint-config-next": "13.5.4",
    "postcss": "^8",
    "typescript": "^5"
  }
}
i've put my tialwindcss into the dependencies and out of the devdependencies, but this didn't fix the problem
think its something to do with my svg
Sloth bear
Update Dependencies. First, check if there are any updates available for your dependencies. Run the following command to update your project's dependencies to their latest compatible versions:

   npm update


First locally redeploy your code using the following Command
   npm build
Giant ChinchillaOP
thomas@DESKTOP-PC4HPS4 ~/Dev-Academy/next-js-blog ‹main●› 
╰─$ npm run build

> myapp@0.1.0 build
> next build

 ✓ Creating an optimized production build    
 ✓ Compiled successfully
 ✓ Linting and checking validity of types    
 ✓ Collecting page data    
   Generating static pages (4/6)  [  ==] 
RangeError: Maximum call stack size exceeded
    at P (/home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:187570)
    at l (/home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:183143)
    at /home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184344
    at Array.forEach (<anonymous>)
    at /home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184317
    at Array.forEach (<anonymous>)
    at a (/home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184137)
    at /home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184401
    at Array.forEach (<anonymous>)
    at l (/home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184094)

Error occurred prerendering page "/nav". Read more: https://nextjs.org/docs/messages/prerender-error
RangeError: Maximum call stack size exceeded
    at P (/home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:187570)
    at l (/home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:183143)
    at /home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184344
    at Array.forEach (<anonymous>)
    at /home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184317
    at Array.forEach (<anonymous>)
    at a (/home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184137)
    at /home/thomas/Dev-Academy/next-js-blog/.next/server/chunks/678.js:5:184401
    at Array.forEach (<anonymous>)
   Generating static pages (5/6)  [    ]

still gettig the same error, what to i do from here?
Sloth bear
What I know, While prerendering your pages, they brought in this error. This can occur for many reasons from adding non-pages e.g. components to your pages folder or expecting props to be populated which are not.

Make sure to move any non-pages out of the pages folder

If possible your can share the repository failed deployment link

Or you can re-address the same issue in the #gpt-help
Giant ChinchillaOP
okay heres my repo .... https://github.com/tom-mcivor/toms-blog
Giant panda
Your root page is marked as a client component which is unnecessary and often detrimental. Also the other two components aren't pages so you should move them either out of the app directory or rename the home/page.tsx and nav/page.tsx files to something else as Next considers those to be pages or just do both.
Giant ChinchillaOP
thanks
Giant ChinchillaOP
i've change the things you mentioned and am still getting an error when deploying https://github.com/tom-mcivor/toms-blog
Giant panda
Random shot: try to rename the app function in src/app/page.tsx using pascal case, so App or Page instead.
Giant ChinchillaOP
the error does seem shorter though
Giant panda
Also please click on the Expand 27 lines in the error message
And show the entire error
Giant ChinchillaOP
my VS code has crashed , need to reboot my entire computer :(, doggy WSL lol
Giant ChinchillaOP
does anyone know why my blog won't deploy?
think its failing on page 3/4
i changed app into function App(){... like you said
path page: /
page: / is just the root directory...
Giant ChinchillaOP
when i changed page.tsx in the app directory it deployed however my app is no longer working.
the following is deploying, but not actually working at all
Giant ChinchillaOP
nvm i solved the issue, downgraded next.js to version 13.4.4 and changed portcss and autoprefixer into dependencies rather than dev devpendencies
Answer