Im trying to deploy a basic next.js app which I just created on cloud66 vm.
This is my package.json of my next.js project:
{
"name": "cloud66",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"lint": "next lint",
"start": "next start",
"cloud66-build": "npm run build && npm run start"
},
"dependencies": {
"next": "13.0.3",
"react": "18.2.0",
"react-dom": "18.2.0"
},
"engines": {
"node":">=14.6.0"
},
"devDependencies": {
"eslint": "^8.27.0",
"eslint-config-next": "^13.0.3"
}
}
when im deploying my app to cloud66 the deployment will be successfull but in the error logs of the server im getting the following error which ends up in not showing anything under my address:
Error: Could not find a production build in the '/app/.next' directory. Try building your app with 'next build' before starting the production server. https://nextjs.org/docs/messages/production-start-no-build-id
optimistic-shy-swallow — at NextNodeServer.getBuildId (/app/node_modules/next/dist/server/next-server.js:165:23)
optimistic-shy-swallow — at new Server (/app/node_modules/next/dist/server/base-server.js:58:29)
optimistic-shy-swallow — at new NextNodeServer (/app/node_modules/next/dist/server/next-server.js:67:9)
optimistic-shy-swallow — at NextServer.createServer (/app/node_modules/next/dist/server/next.js:143:16)
optimistic-shy-swallow — at async /app/node_modules/next/dist/server/next.js:155:31
optimistic-shy-swallow — at async NextServer.prepare (/app/node_modules/next/dist/server/next.js:130:24)
optimistic-shy-swallow — at async /app/node_modules/next/dist/cli/next-start.js:116:9
now from what i found searching on the internet I had the idea to add a custom script to my package.json: "cloud66-build": "npm run build && npm run start" and call it. Cloud66 provides a way to call commands in an extra file defining the command which will be called. I added my script there, but the above error is still there. Does anybody have an idea?
production: # Environment
last_thing: # Hook point
- command: npm run cloud66-build # Hook type // <-- calling the script from my package.json
target: any # Hook fields
execute: true
Related
I tried to use vite to make vue3 apps.
but when I build vue3 apps, build error occurred and
no apps shown in browser.
my PC and node.js version
windows:10
"node":"v16.13.2"
"npm":"v8.1.2"
Basically I started make vue3 apps following the guide and used CommandPrompt to make apps like below.
$npm create vite#latest my-vue-app -- --template vue
↓
$cd my-vue-app
↓
$npm install
↓
$npm run dev
and package.json like this.
{
"name": "vue3testapps",
"private": true,
"version": "0.0.0",
"scripts": {
"dev": "vite",
"build": "vite build",
"preview": "vite preview"
},
"dependencies": {
"vue": "^3.2.25"
},
"devDependencies": {
"#vitejs/plugin-vue": "^2.3.0",
"vite": "^2.6.14"
}
}
after I command "npm run dev",
"Access is denied" was occurred in CommandPrompt.
I thought node.js and npm is ok because my other project
which is vue verison 2 is no problem and githun issues
arguing about node version, but my version is seems ok.
How can I fix the build problem?
Does anyone help me, please?
I have a Node.js application on Heroku. To start it, I need index.jsto be executed. To do that, I added a package.json file with a start script.
As I read in Heroku Node.js Support:
First, Heroku looks for a Procfile specifying your process types.
If no Procfile is present in the root directory of your app during the build process, your web process will be started by running npm start, a script you can specify in package.json...
When I define the start script to be node index.js and I deploy my app to Heroku, I don't see any Dynos in the resources tab.
My code:
package.json
{
"name": "node.js app",
"version": "1.4.0",
"description": "A node.js app.",
"main": "index.js",
"repository": {
"type": "git",
"url": "Node.js repository"
},
"author": "Realex78",
"license": "MPL-2.0",
"dependencies": {
"npm package": "^1.0.0"
},
"devDependencies": {
"npm package": "^1.0.0"
},
"scripts": {
"start": "node index.js",
"poststart": "node scripts/poststart.js",
"restart": "node scripts/restart.js"
}
}
Make sure that you aren't using a Procfile, as Heroku gives it priority over package.json!
I.e. even though I had updated my startup script in package.json:
"scripts": {
"start": "node --harmony server.js"
},
I had forgotten that my Procfile was setup like this:
web: node server.js
Therefore my startup script in package.json was being ignored! The fix was to update my Procfile (to in this case include the --harmony param).
Note that I did not have to wait 24 hours for a successful deploy; it worked immediately.
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?
npm run build
then
npm run start
solved my problem.
First
npm run-script build
Then
npm run start
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 😀😀
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.
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"
}
}
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.
I'm trying to setup my create-react-app instance with webpack-dev-server.
This is my package.json file
{
"name": "reactgs",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.0.0",
"react-dom": "^16.0.0",
"react-scripts": "1.0.14"
},
"scripts": {
"start": "react-scripts start",
"build": "webpack-dev-server --entry ./node_modules/react-scripts/bin/react-scripts.js --output-filename ./dist/bundle.js --inline --progress",
},
"devDependencies": {
"webpack-dev-server": "^2.9.1"
}
}
I don't have a webpack.config.js file.
When I run
npm run build
The output appears as
The following line runs fine.
npm start
I also have webpack setup fine on the same machine for a different project.
Does anyone know how to properly configure webpack for create-react-app?
npm start does the HMR for you out-of-the box. It will host your application using webpack-dev-server --hot itself. You just need to hook the HMR code to tell webpack what to watch and reload as necessary.
This GitHub conversation offers a pretty decent simple solution for hooking HMR (https://github.com/facebookincubator/create-react-app/issues/2317) with and without Redux.
I'm attempting to deploy a newly generated react-scripts based application to GAE and am running into an issue. It appears as though the build completes successfully but it fails during deploy/'Updating service'. Looking for some pointers on how to debug what's happening as I don't see anything in the error log in the console.
Below is the output from the last part of the build:
Step 5 : CMD npm start
---> Running in b930fc7e35e6
---> 2d0d24685054
Removing intermediate container b930fc7e35e6
Successfully built 2d0d24685054
Below is the error I am seeing during the service update:
Updating service [default]...failed.
ERROR: (gcloud.app.deploy) Error Response: [13] Timed out when starting VMs. It's possible that the application code is unhealthy. (0/2 ready, 2 still deploying).
app.yaml:
runtime: nodejs
vm: true
package.json:
{
"name": "venue-web",
"version": "0.1.0",
"private": true,
"engines": {
"node": "~6.8"
},
"devDependencies": {
"react-scripts": "0.7.0"
},
"dependencies": {
"react": "^15.3.2",
"react-dom": "^15.3.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"deploy": "gcloud app deploy --project venue-web"
}
}
I think you are missing react-scripts in your dependencies.