CODEWITHSUNDEEP
reactjstypescriptnext.jsyarnpkgnpm-scripts
Dayvvo
Dayvvo

Reputation: 321

Next Build hangs forever

I'm building an app with NextJs and Typescript. I'm trying to run next build (yarn build) on my local machine to check for typescript warnings and build errors before deploying.

Next build hangs at 'Creating an optimized production build' and hangs forever. Don't even know where to start to address this issue. Can anyone help with this?

Upvotes: 23

Views: 27750

Answers (14)

Harsh Sharma
Harsh Sharma

Reputation: 1

In my case, the build got stuck due to an attempt to access localStorage without first checking if the window object exists. where window is undefined during build time. For example, this code caused the build to fail.

let token;
token = localStorage.getItem("token")

fixed this issue with,

let token;
if (typeof window !== "undefined") {
  token = localStorage.getItem("token");
}

Upvotes: 0

Gianfranco P
Gianfranco P

Reputation: 10804

I downgraded from Node 23 to 22 on a Next.js 13 app

After downgrading:

$ npx next info 
Binaries:
  Node: 22.9.0
  npm: 10.8.3
  Yarn: 1.22.22
  pnpm: 9.12.3
Relevant Packages:
  next: 13.5.7
  eslint-config-next: 13.4.12
  react: 18.3.1
  react-dom: 18.3.1
  typescript: 5.5.4

I had the homebrew (macos) export PATH at the bottom of my .zshrc file.

I moved the asdf setup after that

.zshrc

PATH="/opt/homebrew/bin:$PATH"

export PATH

[ -f /usr/local/opt/asdf/libexec/asdf.sh ] && . /usr/local/opt/asdf/libexec/asdf.sh
[ -f /opt/homebrew/opt/asdf/libexec/asdf.sh ] && . /opt/homebrew/opt/asdf/libexec/asdf.sh

Upvotes: 0

DMabulage
DMabulage

Reputation: 876

Make sure to kill the dev server before running the build

Upvotes: 1

Mohammad Ghorayshi
Mohammad Ghorayshi

Reputation: 31

After trying all recommendation here and all are not working, I just found out the reason after 24 hours of debugging is @next/font package, removing it completely fixes my issue. The main reason is that most of the time it fail to download fonts without showing any signs of error.

I commented this line from layout.tsx:

import { Inter } from 'next/font/google';

Hope this helps you guys, cheers!

Upvotes: 0

vishal
vishal

Reputation: 1205

I was using Antd library and because of the below line the build was getting stuck.

import { List, Table, Typography } from "antd";

const { Text } = Typography;

As per Antd docs we are not supposed to use sub-components: https://ant.design/docs/react/use-with-next enter image description here

After removing this line it started working.

Had to manually comment code every file and uncomment one by one and build to find this issue. Really sad that the next build process does not give any info or error when this happens.

Anyways if you are using Antd maybe this will save you few hours.

Upvotes: -1

Mustafa Cor
Mustafa Cor

Reputation: 9

check the development server (npm run dev). If it's running stop it. delete this folders & file : next, node_modules, package-lock.json

rm -rf .next/ node_modules/ package-lock.json

I fixed the problem with these

Upvotes: 0

Oded Ben Dov
Oded Ben Dov

Reputation: 10416

Tried all the excellent suggestions here, but for me the problem was with optimizing one of the external packages. Since performance wasn't a big issue for me, skipping minifying solved it.

You need this in your next.config.js:

const nextConfig = {
  swcMinify: false, // 'minify' in Next versions < 12.0
}

And to make sure this works, I reiterated all the above comments to make sure I wasn't hanging on one of the billion previous attempts :)

Upvotes: 3

Rub&#233;n V&#225;zquez
Rub&#233;n V&#225;zquez

Reputation: 43

You can't have both dev and build at the same time.

I solved it very quickly when I realized that there were several nodejs processes open when there should only be 1, and killing all the nodejs processes that were running in the background solved it for me.

It can also happen that a build started to fail and got stuck in the background so you should kill all the nodejs you see running in the task manager. I am using Nextjs 13

Upvotes: 1

walidAtlasTrip
walidAtlasTrip

Reputation: 21

Make sure you stoped all servers that running in the background Use npx kill-port 3000

Upvotes: 2

Dayvvo
Dayvvo

Reputation: 321

So the issue with it was that I had an empty file somewhere in the app. Apparently the empty file was what was hanging the build

Upvotes: 0

Jowar Rivera
Jowar Rivera

Reputation: 1

I solved it downgrading npm version to v8.5.5. I was testing using v8.12.2 and it always keep in "Checking validity of types"

Upvotes: -2

Jongyeol Baek
Jongyeol Baek

Reputation: 41

I had the same issue too.

I solved it by upgrading node version from v16.13.0 to v16.14.0.

Upvotes: 4

Dayvvo
Dayvvo

Reputation: 321

Have found the solution to the issue. Apparently the build freeze was caused by empty files located all over my project directory. Removed all of them and next build runs

Upvotes: 4

EcksDy
EcksDy

Reputation: 1664

Could be a cache issue.

I'd start by removing /.next folder, if it didn't work then both /.next and /node_modules. Whenever you have issues with Next you don't know how to approach or it's just acting weird - removing /.next will solve most of the problems.

Upvotes: 34

Related Questions