React App fails after deploy to Azure App Service - reactjs

I build React App and deploy it to Linux Plan at Azure App Service.
I have 2 versions of service at 2 different Service Plans.
After some changes at code, I tried to deploy it to one of the Plans and it can't start/
Locally it works normally.
But at the server I got this message ":( Application Error";
I deploy application by Visual Studio Code but got same problem with Github Actions.
At log files, I found this
Cound not find build manifest file at '/home/site/wwwroot/oryx-manifest.toml'
Could not find operation ID in manifest. Generating an operation id...
Looks strange, because on the second Service Plan I have this file and this version worked.
Second message on logs
npm start
npm info it worked if it ends with ok
npm info using npm#6.14.14
npm info using node#v12.22.4
pm info lifecycle backup-resurge#0.1.0~prestart: backup-resurge#0.1.0
npm info lifecycle backup-resurge#0.1.0~start: backup-resurge#0.1.0
backup-resurge#0.1.0 start /home/site/wwwroot
react-scripts start
/home/site/wwwroot/node_modules/.bin/../node/bin/node: 1: /home/site/wwwroot/node_modules/.bin/../node/bin/node: This: not found
npm info lifecycle backup-resurge#0.1.0~start: Failed to exec start script
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! backup-resurge#0.1.0 start: react-scripts start
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the backup-resurge#0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm timing npm Completed in 1606ms
But I think that's file exists
Does anyone know what I can try to solve this problem?

Related

Error 404 on React site after a failed build. File cannot be found

I have a react app which build and deploys fine on my development environment. Now I did some refactoring which was limited to moving a few files, commiting, testing and redeploying. After the latest change I deployed to productiong and found that on production I got a 404 when accessing the site. 404 not found. I'm completely stumped as to what may be the problem.
Reviewing the bitbucket pipeline I get the following output:
./src/pages/Home.jsx
Cannot find file '../components/narrative/Narrative' in './src/pages'.
Now if I have a look at './src/pages/Home.jsx' I can see I'm importing the below
import Narrative from "../components/narrative/Narrative"
And that file does indeed exist:
The full output of the pipeline is here:
root#ubuntu-web:~/eg-web# npm run build
> refgator-web#0.1.0 build /root/eg-web
> react-scripts build
Creating an optimized production build...
Browserslist: caniuse-lite is outdated. Please run:
npx browserslist#latest --update-db
Why you should do it regularly:
https://github.com/browserslist/browserslist#browsers-data-updating
Failed to compile.
./src/pages/Home.jsx
Cannot find file '../components/narrative/Narrative' in './src/pages'.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! refgator-web#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the refgator-web#0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2022-02-16T10_23_04_697Z-debug.log
And if I go to the production server this is the latest error log:
This was actually caused by the folder name as it is locally called narrative. On the repo it's Narrative
I changed this with help from this answer In a Git repository, how to properly rename a directory?

Vercel React.js Deployment: Cannot find module: 'firebase'. Make sure this package is installed

I deployed a react app to Vercel that uses firebase. The build exits with status code 1.
I have installed firebase using: "npm install firebase" and it is running well on the local environment. What would be the possible error?
Creating an optimized production build...
Failed to compile.
./src/firebase.js
Cannot find module: 'firebase'. Make sure this package is installed.
You can install this package by running: npm install firebase.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! neozon#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the appname#0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /vercel/.npm/_logs/2022-01-11T18_49_38_751Z-debug.log
Error: Command "npm run build" exited with 1
My guess is that the firebase package isn't installed on the server (unlike on your local environment), which most likely reads the dependencies from the package.json.
To add firebase to your package.json on your local system, run:
npm install firebase --save

how to publish a react js website on gitlab

i created a static react js project and i pushed it to git-lab excluding node modules. But now i am not able to publish my website it is showing deploy failed. but the build was successful. i know that i should make some changes to packagejson file but i dont know what all changes to be done. kindly please guide me in this issue
npm ERR! npm bugs my-app
npm ERR! Or if that isn't available, you can get their info via:
npm ERR! npm owner ls my-app
npm ERR! There is likely additional logging output above.
npm ERR! Please include the following file with any support request:
npm ERR! /builds/Adithyets/react-website/npm-debug.log
Cleaning up file based variables
ERROR: Job failed: exit code 1

React app errors when pushing to GitHub pages

When pushing my React app to GitHub Pages, I continue to get various error messages. Some projects when viewed through GitHub just have a blank screen, others have 404 page not found errors, others bring up a page telling me that "this project was bootstrapped with create react app."
I have tried using several different tutorials to deploy the projects in different ways.
this one
this video
The one and only project I got to work I used "deploy": "gh pages -b master -d build". I have been installing gh pages using npm install gh-pages --save-dev on my projects.
This is an example of the error I get in my terminal:
sh: gh: command not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! count-up#0.1.0 deploy: `gh pages -b master -d build`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the count-up#0.1.0 deploy script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/connortwele/.npm/_logs/2020-08-08T15_59_50_754Z-debug.log
MacBook-Pro:count-up connortwele$

create-react-app npm run build fail to minify watson node sdk

I am new to React and I am trying to build a react app using create-react-app and Watson node-sdk. Everything works fine in development mode after running npm start. But when I try to build a production package using npm run build and below is the error I receive.
e:\Microsoft\Workspace\React\myapp>npm run build
> myapp#0.1.0 build e:\Microsoft\Workspace\React\myapp
> react-scripts build
Creating an optimized production build...
Failed to compile.
Failed to minify the code from this file:
./node_modules/watson-developer-cloud/lib/helper.js:31
Read more here: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-build-fails-to-minify
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! myapp#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the myapp#0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional
logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\yk\AppData\Roaming\npm-cache\_logs\2017-09-
20T09_40_36_144Z-debug.log
The line that giving error is let missing; and seems like the let is causing the issue. Is there anything I can do with this?
Encountered this problem today. the doc suggests some solutions:
Open an issue on the dependency's issue tracker and ask that the package be published pre-compiled.
Fork the package and publish a corrected version yourself.
If the dependency is small enough, copy it to your src/ folder and treat it as application code.
Read more here: https://github.com/facebookincubator/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-build-fails-to-minify

Resources