NextJS cannot find a valid build in the '.next' directory - node.js

Question

I looked at the following question before asking this one but I believe mine is different because I am not using Docker: Nextjs fails to find valid build in the '.next' directory in production node_env
I also tried this approach of removing the '.next' folder but still get the same issue.
After fixing a host of other issues, I am down to one I cannot seem to resolve. When I try to deploy to Heroku I keep getting the following error:
node server.js
Could not find a valid build in the '.next' directory! Try building your app with 'next build' before starting the server.
Here is my package.json file:
{
"name": "StarterApp",
"version": "1.0.0",
"engines": {
"node": "10.4.1"
},
"description": "",
"main": "index.js",
"scripts": {
"test": "mocha",
"dev": "node server.js"
},
"author": "",
"license": "ISC",
"dependencies": {
"express": "4.16.3",
"fs-extra": "^5.0.0",
"ganache-cli": "^6.1.3",
"mocha": "^5.2.0",
"next": "^4.2.3",
"next-routes": "^1.4.2",
"node-gyp": "^3.7.0",
"react": "^16.4.1",
"react-dom": "^16.4.1",
"rebuild": "^0.1.2",
"semantic-ui-css": "^2.3.2",
"semantic-ui-react": "^0.79.1",
"sha3": "^1.2.2",
"solc": "^0.4.24",
"truffle-hdwallet-provider": "0.0.3",
"web3": "^1.0.0-beta.34"
}
}
Server.js file:
const { createServer } = require('http');
const next = require('next');
const app = next({
dev: process.env.NODE_ENV !== 'production'
});
const routes = require('./routes');
const handler = routes.getRequestHandler(app);
app.prepare().then(() => {
createServer(handler).listen(5000, (err) => {
if (err) throw err;
console.log('Ready on localhost:5000');
});
});
The app deploys without issue locally but I get this error when deploying to Heroku. What am I doing wrong?

Answer 1

npm run build
then
npm run start
solved my problem.

Answer 2

First
npm run-script build
Then
npm run start

Answer 3

Just see the error carefully:
Error: Could not find a production build in the 'E:\Developer's Area\weatherteller\.next' directory. Try building your app with 'next build' before s at Server.readBuildId (E:\Developer's Area\weatherteller\node_modules\next\dist\next-server\server\next-server.js:146:355)
at new Server (E:\Developer's Area\weatherteller\node_modules\next\dist\next-server\server\next-server.js:3:120)
at createServer (E:\Developer's Area\weatherteller\node_modules\next\dist\server\next.js:2:638)
at start (E:\Developer's Area\weatherteller\node_modules\next\dist\server\lib\start-server.js:1:323)
at nextStart (E:\Developer's Area\weatherteller\node_modules\next\dist\cli\next-start.js:19:125)
at E:\Developer's Area\weatherteller\node_modules\next\dist\bin\next:27:115
while running
npm start
It's not able to locate the production build which is required to launch the next app. While creating next app using
npm install next react react-dom --save
.next folder was not created so you need to create the .next folder first using
npm build
which will consist of all your production build files.
After npm build the folder will be created and you can run your app using
npm start
Also, make sure these scripts are in your next app
"scripts": {
"dev": "next",
"build": "next build",
"start": "next start"
},
Hope this resolves your error 😀😀

Answer 4

I had the same issue once.
First, remove package-lock.json or yarn.lock files and node_modules folder and make sure you install all the packages again with the yarn command.
I had to run yarn build first and then the yarn start command was working fine afterward.
Also if the currently used port is taken by another app you will have issues running your dev environment. You can easily fix that by going into the package.json file and modifying the "dev" script like this: "dev": PORT=7080 next dev".
Also possibly you are mixing Next.js with React because in Next.js you should use yarn dev to start your project for development instead of yarn start.
I hope this was helpful to you.

Answer 5

NextJS building may be (depending on your project size), be extremely large, something that can cost you money during deploys.
You can apply the following to your package.json
{
"script": {
"build": "next build",
"heroku-postbuild": "npm run build",
"start": "next start"
}
}

Answer 6

I was getting this error when trying to start a production server from the build directory after setting.
distDir: 'build',
actual error
Error: Could not find a production build in the '/home/username/awesome-app/build/build' directory. Try building your app with 'next build' before starting the production server. https://nextjs.org/docs/messages/production-start-no-build-id
and my start command
$ next start build
so I moved the next build directory to another directory named build and it works, and if you are using environment variable put that file inside the build directory.