while deploying the MERN app i got this error Module not found: Error: Can't resolve './components/Navbar/Navbar' in '/opt/render/project/src/frontend/src
but my localhost is working absolutely without any warnings and errors.
here’s build command
Hi there,
Thanks for reaching out.
You may want the casing on your file path. Linux is case-sensitive, so the captial N 's matter in the folder and filenames.
Hope that helps
Alan
hey @al_ps i’m not using linux and i’ve used Capitals everywhere since react is also case Sensitive 
You may not be using Linux, but Render does.
Your repo is public, so I can see the issue is what I suggested previously. The folder name for navbar needs to be Navbar.
Alan
what about this? it’s looking good without any error but deployment is failed why?
here’s the whole message
Nov 26 02:43:36 PM ==> Cloning from https://github.com/MahendraBishnoi29/MERN-movie-review-app...
Nov 26 02:43:36 PM ==> Checking out commit 6c83884152f1600fb144a859324d7a2013876fdc in branch main
Nov 26 02:43:39 PM ==> Downloading cache...
Nov 26 02:43:50 PM ==> Transferred 47MB in 8s. Extraction took 1s.
Nov 26 02:43:52 PM ==> Running build command 'npm run build'...
Nov 26 02:43:52 PM
Nov 26 02:43:52 PM > mern-movie-rating@1.0.0 build /opt/render/project/src
Nov 26 02:43:52 PM > cd backend && npm install && cd ../frontend && npm install && npm run build
Nov 26 02:43:52 PM
Nov 26 02:44:00 PM
Nov 26 02:44:00 PM > bcrypt@5.0.1 install /opt/render/project/src/backend/node_modules/bcrypt
Nov 26 02:44:00 PM > node-pre-gyp install --fallback-to-build
Nov 26 02:44:00 PM
Nov 26 02:44:00 PM [bcrypt] Success: "/opt/render/project/src/backend/node_modules/bcrypt/lib/binding/napi-v3/bcrypt_lib.node" is installed via remote
Nov 26 02:44:00 PM
Nov 26 02:44:00 PM > core-js@3.6.5 postinstall /opt/render/project/src/backend/node_modules/core-js
Nov 26 02:44:00 PM > node -e "try{require('./postinstall')}catch(e){}"
Nov 26 02:44:00 PM
Nov 26 02:44:00 PM
Nov 26 02:44:00 PM > nodemon@2.0.19 postinstall /opt/render/project/src/backend/node_modules/nodemon
Nov 26 02:44:00 PM > node bin/postinstall || exit 0
Nov 26 02:44:00 PM
Nov 26 02:44:00 PM Love nodemon? You can now support the project via the open collective:
Nov 26 02:44:00 PM > https://opencollective.com/nodemon/donate
Nov 26 02:44:00 PM
Nov 26 02:44:01 PM added 260 packages from 314 contributors and audited 261 packages in 7.443s
Nov 26 02:44:01 PM
Nov 26 02:44:01 PM 18 packages are looking for funding
Nov 26 02:44:01 PM run `npm fund` for details
Nov 26 02:44:01 PM
Nov 26 02:44:01 PM found 1 critical severity vulnerability
Nov 26 02:44:01 PM run `npm audit fix` to fix them, or `npm audit` for details
Nov 26 02:44:33 PM
Nov 26 02:44:33 PM > core-js@3.24.1 postinstall /opt/render/project/src/frontend/node_modules/core-js
Nov 26 02:44:33 PM > node -e "try{require('./postinstall')}catch(e){}"
Nov 26 02:44:33 PM
Nov 26 02:44:33 PM
Nov 26 02:44:33 PM > core-js-pure@3.24.1 postinstall /opt/render/project/src/frontend/node_modules/core-js-pure
Nov 26 02:44:33 PM > node -e "try{require('./postinstall')}catch(e){}"
Nov 26 02:44:33 PM
Nov 26 02:44:33 PM
Nov 26 02:44:33 PM > styled-components@5.3.5 postinstall /opt/render/project/src/frontend/node_modules/styled-components
Nov 26 02:44:33 PM > node ./postinstall.js
Nov 26 02:44:33 PM
Nov 26 02:44:34 PM
Nov 26 02:44:34 PM > swiper@8.4.2 postinstall /opt/render/project/src/frontend/node_modules/swiper
Nov 26 02:44:34 PM > node -e "try{require('./postinstall')}catch(e){}"
Nov 26 02:44:34 PM
Nov 26 02:44:35 PM added 1466 packages from 697 contributors and audited 1470 packages in 33.71s
Nov 26 02:44:36 PM
Nov 26 02:44:36 PM 207 packages are looking for funding
Nov 26 02:44:36 PM run `npm fund` for details
Nov 26 02:44:36 PM
Nov 26 02:44:36 PM found 10 vulnerabilities (8 high, 2 critical)
Nov 26 02:44:36 PM run `npm audit fix` to fix them, or `npm audit` for details
Nov 26 02:44:37 PM
Nov 26 02:44:37 PM > frontend@0.1.0 build /opt/render/project/src/frontend
Nov 26 02:44:37 PM > react-scripts build
Nov 26 02:44:37 PM
Nov 26 02:44:40 PM Creating an optimized production build...
Nov 26 02:45:20 PM Compiled with warnings.
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM [eslint]
Nov 26 02:45:20 PM src/components/Admin/Actors/Actors.jsx
Nov 26 02:45:20 PM Line 5:10: 'deleteActor' is defined but never used no-unused-vars
Nov 26 02:45:20 PM Line 12:8: 'ConfirmModal' is defined but never used no-unused-vars
Nov 26 02:45:20 PM Line 20:10: 'busy' is assigned a value but never used no-unused-vars
Nov 26 02:45:20 PM Line 20:16: 'setBusy' is assigned a value but never used no-unused-vars
Nov 26 02:45:20 PM Line 23:10: 'showConfirmModal' is assigned a value but never used no-unused-vars
Nov 26 02:45:20 PM Line 23:28: 'setShowConfirmModal' is assigned a value but never used no-unused-vars
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM Search for the keywords to learn more about each warning.
Nov 26 02:45:20 PM To ignore, add // eslint-disable-next-line to the line before.
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM File sizes after gzip:
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM 106.19 kB build/static/js/main.1c09abbd.js
Nov 26 02:45:20 PM 7.31 kB build/static/css/main.ca1eea75.css
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM The project was built assuming it is hosted at /.
Nov 26 02:45:20 PM You can control this with the homepage field in your package.json.
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM The build folder is ready to be deployed.
Nov 26 02:45:20 PM You may serve it with a static server:
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM npm install -g serve
Nov 26 02:45:20 PM serve -s build
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM Find out more about deployment here:
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM https://cra.link/deployment
Nov 26 02:45:20 PM
Nov 26 02:45:20 PM ==> Generating container image from build. This may take a few minutes...
Nov 26 02:46:57 PM ==> Uploading build...
Nov 26 02:47:32 PM ==> Build uploaded in 23s
Nov 26 02:47:32 PM ==> Build successful 🎉
Nov 26 02:47:32 PM ==> Deploying...
Nov 26 02:47:57 PM ==> Starting service with 'npm start'
Nov 26 02:48:00 PM
Nov 26 02:48:00 PM > mern-movie-rating@1.0.0 start /opt/render/project/src
Nov 26 02:48:00 PM > node backend/app.js
Nov 26 02:48:00 PM
Nov 26 02:48:12 PM Server is Running
Nov 26 02:48:15 PM DB Connected 🚀
I can only go by what I saw in Github, not on your local machine. It looks like the casing is now correct in GitHub and the service shows a successful deploy.
Alan
yes it’s deployed but it says no route found? https://mern-movie-rating.onrender.com/
I guess you’re running your backend code, which has no root path route: https://github.com/MahendraBishnoi29/MERN-movie-review-app/blob/da9302b47f965a39e2249a0b94807b60358ac909/backend/app.js#L25
https://mern-movie-rating.onrender.com/api/movie/top-rated seems to respond as I would expect.
Alan
that was my mistake i know. but now i deployed my backend separately and it’s working fine.
but while deploying frontend repo i used npm run build as build command and npm start as start command but deployment is failing.
here’s whole message:
Nov 30 11:47:04 AM ==> Cloning from https://github.com/MahendraBishnoi29/movie-rating-frontend-test...
Nov 30 11:47:05 AM ==> Checking out commit 58640e28bac079aad7e900d2bb0ba88b9c34e4fa in branch main
Nov 30 11:47:10 AM ==> Running build command 'npm run build'...
Nov 30 11:47:10 AM
Nov 30 11:47:10 AM > frontend@0.1.0 build /opt/render/project/src
Nov 30 11:47:10 AM > react-scripts build
Nov 30 11:47:10 AM
Nov 30 11:47:10 AM sh: 1: react-scripts: not found
Nov 30 11:47:10 AM npm ERR! code ELIFECYCLE
Nov 30 11:47:10 AM npm ERR! syscall spawn
Nov 30 11:47:10 AM npm ERR! file sh
Nov 30 11:47:10 AM npm ERR! errno ENOENT
Nov 30 11:47:10 AM npm ERR! frontend@0.1.0 build: `react-scripts build`
Nov 30 11:47:10 AM npm ERR! spawn ENOENT
Nov 30 11:47:10 AM npm ERR!
Nov 30 11:47:10 AM npm ERR! Failed at the frontend@0.1.0 build script.
Nov 30 11:47:10 AM npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Nov 30 11:47:10 AM
Nov 30 11:47:10 AM npm ERR! A complete log of this run can be found in:
Nov 30 11:47:10 AM npm ERR! /opt/render/.cache/_logs/2022-11-30T06_17_10_397Z-debug.log
Nov 30 11:47:10 AM ==> Build failed 😞
Nov 30 11:47:10 AM ==> Generating container image from build. This may take a few minutes...
It sounds like you haven’t installed dependencies for your frontend. A Node Build Command will often be something like npm install; npm run build.
Looking again at https://github.com/MahendraBishnoi29/MERN-movie-review-app, it looks like you have a monorepo, again, I can only go by what I can see in the repo, but it feels like the set-up you want would be:
-
A Web Service for the backend
- Root Directory: “backend”
- Build Command: “npm install”
- Start Command: “node app.js”
-
A Static Site for the frontend
- Root Directory: “frontend”
- Build Command: “npm run build” (static sites auto-install dependencies)
- Publish Directory: “public”
Alan
i did the same as you said. i have a separate repo for frontend : GitHub - MahendraBishnoi29/movie-rating-frontend
i want to deploy this frontend repo and here are the commands that i gave while deploying but it’s failing.
You’ve not shared any logs, which would likely show while it’s failing. I’d guess it’s because you’re using a Web Service. You would need to install your dependencies. npm install; npm run build
I suggested trying a Static Site for the frontend (which auto install dependencies).
Alan
@al_ps i’ve deployed backend and then i’ve set that deployed link to my client side see Here and it’s fetching data from DB and working fine on localhost but it’s not working on deployed site see Here . why is that?
I’m not sure, you’ll need to debug the issue since it seems to be with your code. Maybe it’s a CORS issue? Look in the browser console, review your app logs, etc.
Alan
This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.