I'm running fastify on node.js and using Caddy server for reverse proxying localhost to a domain (authsvc.dev) that serves up an index.html file in this UI project.
All was running fine until a couple days ago. Now, when I run npm run ui I get the following error messages in the console. The index.html file is not being served up. The src/public/index.html file exists and was working a couple days ago, but maybe some issue with npx serve {{path-to-file}}? Please help!
ERROR: Not able to read /{{path-to-proj}}/ui/src/public/index.html/serve.json: ENOTDIR: not a directory, open '/{{path-to-proj}}/ui/src/public/index.html/serve.json'
npx serve src/public/index.html exited with code 1
Not sure where or why index.html/serve.json is trying to be read and how to go about fixing it.
I'm running macOs Big Sur v11.6
Some things I've tried.
Deleting node_modules and npm install
Deleting package-lock.json and npm install
updating to latest npm
Changing to different version of node (now on v14.15.1)
Clearing npm cache rm -rf ~/.npm npm clear cache
npx serve src/public/ -- allows me to see when I'm at localhost:5000, but not authsvc.dev
I do have Caddy running with a reverse proxy set up.
{
local_certs
}
authsvc.dev {
reverse_proxy 127.0.0.1:5000
}
api.authsvc.dev {
reverse_proxy 127.0.0.1:4000
}
Host file
127.0.0.1 authsvc.dev
127.0.0.1 api.authsvc.dev
package.json scripts
"scripts": {
"all": "concurrently \"npm run server\" \"cd ../ui\" \"npm run ui\"",
"server": "cd ../api && npm run start",
"ui": "concurrently \"nodemon src/index.js\" \"npx serve src/public/index.html\"",
"ui1": "nodemon src/index.js",
"ui2": "npx serve src/public/",
"caddy": "caddy run",
"test": "node --experimental-vm-modules node_modules/jest/bin/jest.js --watchAll"
},
"dependencies": {
"colors": "^1.4.0",
"concurrently": "^6.2.2",
"cross-fetch": "^3.1.4",
"dotenv": "^10.0.0",
"fastify": "^3.22.0",
"fastify-static": "^4.2.3"
}
Serve should not take an .html file but the folder containing your entire website.
You can try this command : serve src/public/, without the npx prefix and normally it should work 😉
Related
i try many times but can not find the problem need argent help please help anyone.when i deployed on heroku backend routes work but client build static not work
this is my github repo https://github.com/Tanvir-Niloy/Manobik_Narsingdi
Heroku is mostly for making server side apis so you would connect it to your client side app to make it have server side.
From your package.json
"scripts": {
"start": "node server/server.js",
"server": "nodemon server/server",
"client": "npm start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
},
You also have a Procfile with the content: web: node server/server.js
Without the Procfile Heroku would have executed web: npm start which is the same as web: node server/server.js anyway.
But as you can see from the start script you are not executing your client project. You are merely running the backend but you are not serving your static websites.
You either need to host your client project somewhere (GitHub has some solutions: GitHub pages, Netlify, Vercel, ...) or you need to serve your static content from your server project. You are kinda doing it but as of now you are continuously changing your code:
app.use(express.static(Path.join(__dirname, '/client/build/static')))
To me it looks like you have a path issue here. Should be './../client/build/static' assuming the build files are placed in the client folder.
Sharing the build.log would also help to see if your project builds properly on Heroku.
Trying to streamline my package.json and local development with a custom script to run Nodemon. I'm currently building an app with a front and back end I need to call mongod before start and before my custom in two tabs however I'm running into an issue.
mongod will only run in the terminal if the terminal path is set to local from testing and I've read:
Correct way of starting mongodb and express?
npm starts to execute many prestart scripts
How to npm start at a different directory
How do I add a custom script to my package.json file that runs a javascript file?
I can use prestart as:
"scripts": {
"prestart": "cd && mongod",
"start": "node app",
"nodemon": "./node_modules/.bin/nodemon app"
}
but I'm not seeing how I should chain a prestart with a custom scripts. When I try to chain it with nodemon as:
"scripts": {
"prestart": "cd && mongod",
"start": "node app",
"nodemon": "cd && mongod && ./node_modules/.bin/nodemon app"
},
Nodemon is fired first than mongodb crashes in my package.json when I call Nodemon as:
npm run nodemon
How can I start mongod before starting nodemon in my development process through one command in the package.json?
So I am trying to make my first react app. I have it working just fine locally. The problem is that I cannot upload my project to Heroku.
This is my app setup:
my file arrangement. I built this starting with a create-react-app, wrapped that entire thing in a "client" folder, and created a normal node server arrangement outside. I haven't touched my react app's package.json" except to add a socketio dependency, other than that it is exactly what create-react-app spits out.
I get this error on console when attempting to upload:
"sh: 1: react-scripts: Permission denied"
I have gone through https://devcenter.heroku.com/articles/nodejs-support, but to no avail.
This is my "outside" package.json scripts and dependencies
"scripts": {
"client": "npm start --prefix client",
"server": "node server.js",
"start": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "cd client && npm run build"
},
"dependencies": {
"concurrently": "^4.0.1",
"express": "^4.16.4"
"socket.io": "^2.1.1"
}
UPDATE:
I've not gotten my application to work yet HOWEVER I finally found something interesting.
This: https://github.com/mars/heroku-cra-node
Looks like a barebones application I can essentially my stuff to, and have it work on Heroku. I've not added my code yet, I'll report back.
UPDATE:
Yep, seems to get past this permission BS. Now I just have to deal with getting socket.io client to connect... -_-
Change your script to this:
"scripts": {
"start": "node index.js",
"server": "nodemon index.js",
"client": "npm run start --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "NPM_PRODUCTION=false npm install --prefix client && npm run build --prefix client",
},
npm run dev will start your server and client in development mode...
You can also install nodemon to make your life easier...
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 set docker instance with node.
i want to develop on this instance and use babel to "compile" my node code.
i use #docker/cli to compile with watch flag and i use nodemon with -L flag.
for some reason, nodemon is watching file changes great but not babel.
any idea?
this is my docker-compose.yml
main-app:
build: ./mainApp
user: "root"
command: yarn run start:watch
environment:
NODE_ENV: production
PORT: 8080
volumes:
- ./mainApp:/app
- /app/node_modules
ports:
- '8080:8080'
this is package.json:
"scripts": {
"build": "babel src --out-dir public",
"serve": "node public/server.js",
"build:watch": "babel --watch src -d public -s",
"serve:watch": "nodemon -L public/server.js",
"start:watch": "concurrently -k \"npm run build:watch\" \"npm run serve:watch\""
},
"dependencies": {
"express": "^4.16.1"
},
"devDependencies": {
"#babel/cli": "^7.0.0-beta.35",
"#babel/core": "^7.0.0-beta.35",
"#babel/preset-env": "^7.0.0-beta.35"
},
as you can see i use concurrently to run them both.
what can be the problem babel is not watching my files?
PS: it works fine on my local machine
babel-watch didn't worked out for me.
As I was compiling code through babel cli and outputting in some another directory (to be used by second docker container)
I ended up using nodemon exec option
In my package.json, created new script especially for docker:
"docker-build:watch": nodemon -L --watch src --exec 'npm run build:watch'
and then using npm run docker-build:watch instead of npm run build:watch
Babel CLI uses Chokidar to watch file changes, to make it work inside a linux image you need to:

CHOKIDAR_USEPOLLING=true babel --watch


You can read more about this here
I was having a similar issue and ended up using 'babel-watch'. IT still required me to use the -L flag to enable poling to get it to work in Docker. I have not tried it, but the same approach may work with babel itself.
Take a look at the babel-watc readme for more details. https://github.com/kmagiera/babel-watch#troubleshooting
You filesystem configuration doesn't trigger filewatch notification
(this could happen for example when you have babel-watch running
within docker container and have filesystem mirrored). In that case
try running babel-watch with -L option which will enable polling for
file changes.