This is the error that I got. It says run the npm bugs reminderpro. I did that but nothing works. My code has sfcookies from npm. When i deployed earlier it said that sfcookies did not download.... something like that. So i tried typing sfcookies on package.json under dependencies but that did not work too. Now is there a SPECIFIC way to put these on heroku, am i missing somehting. (I used create-react-app for initial installation)
remote: npm ERR! Linux 3.13.0-128-generic
remote: npm ERR! argv "/tmp/build_d018c5494b246e95e5185c9297b315ce/.heroku/node/ bin/node" "/tmp/build_d018c5494b246e95e5185c9297b315ce/.heroku/node/bin/npm" "ru n" "build"
remote: npm ERR! node v6.11.3
remote: npm ERR! npm v3.10.10
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! reminderpro#0.1.0 build: `react-scripts build`
remote: npm ERR! Exit status 1
remote: npm ERR!
remote: npm ERR! Failed at the reminderpro#0.1.0 build script 'react-scripts bui ld'.
remote: npm ERR! Make sure you have the latest version of node.js and npm instal led.
remote: npm ERR! If you do, this is most likely a problem with the reminderpro p ackage,
remote: npm ERR! not with npm itself.
remote: npm ERR! Tell the author that this fails on your system:
remote: npm ERR! react-scripts build
remote: npm ERR! You can get information on how to open an issue for this projec t with:
remote: npm ERR! npm bugs reminderpro
remote: npm ERR! Or if that isn't available, you can get their info via:
remote: npm ERR! npm owner ls reminderpro
remote: npm ERR! There is likely additional logging output above.
remote:
remote: npm ERR! Please include the following file with any support request:
remote: npm ERR! /tmp/build_d018c5494b246e95e5185c9297b315ce/npm-debug.log
remote: ! Push rejected, failed to compile React.js (create-react-app) mult i app.
remote:
remote: ! Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to sheltered-plateau-76958.
This is my package.json:
{
"name": "reminderpro",
"version": "0.1.0",
"private": true,
"dependencies": {
"moment": "^2.18.1",
"react": "^15.6.1",
"react-dom": "^15.6.1",
"react-redux": "^5.0.6",
"react-scripts": "1.0.13",
"redux": "^3.7.2"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Is the build script being called before the install?
You should show the code for your package.json as I could better get a grasp of the order Heroku calls your scripts.
Related
Next.js App, all work fine on localhost, when I push to Heroku, Push rejected, idk why. Please help my heroes.
Heroku Push logs:
remote: -----> Installing binaries
remote: engines.node (package.json): unspecified
remote: engines.npm (package.json): unspecified (use default)
remote:
remote: Resolving node version 18.x...
remote: Downloading and installing node 18.12.1...
remote: Using default npm version: 8.19.2
remote:
remote: -----> Installing dependencies
remote: Installing node modules
remote: npm ERR! code ERESOLVE
remote: npm ERR! ERESOLVE could not resolve
remote: npm ERR!
remote: npm ERR! While resolving: react-lightgallery#0.9.0
remote: npm ERR! Found: react#18.2.0
remote: npm ERR! node_modules/react
remote: npm ERR! react#"^18.2.0" from the root project
remote: npm ERR! peer react#"^17.0.2 || ^18.0.0-0" from next#12.2.6
remote: npm ERR! node_modules/next
remote: npm ERR! next#"12.2" from the root project
remote: npm ERR! 9 more (react-circular-progressbar, react-dom, react-modal, ...)
remote: npm ERR!
remote: npm ERR! Could not resolve dependency:
remote: npm ERR! peer react#"^16.13.1" from react-lightgallery#0.9.0
remote: npm ERR! node_modules/react-lightgallery
remote: npm ERR! react-lightgallery#"^0.9.0" from the root project
remote: npm ERR!
remote: npm ERR! Conflicting peer dependency: react#16.14.0
remote: npm ERR! node_modules/react
remote: npm ERR! peer react#"^16.13.1" from react-lightgallery#0.9.0
remote: npm ERR! node_modules/react-lightgallery
remote: npm ERR! react-lightgallery#"^0.9.0" from the root project
remote: npm ERR!
remote: npm ERR! Fix the upstream dependency conflict, or retry
remote: npm ERR! this command with --force, or --legacy-peer-deps
remote: npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
remote: npm ERR!
remote: npm ERR! See /tmp/npmcache.WP8R2/eresolve-report.txt for a full report.
remote:
remote: npm ERR! A complete log of this run can be found in:
remote: npm ERR! /tmp/npmcache.WP8R2/_logs/2022-12-16T21_23_22_466Z-debug-0.log
remote:
remote: -----> Build failed
package.json:
{
"name": "test-app",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start -p $PORT",
"lint": "next lint"
},
"dependencies": {
"isotope-layout": "^3.0.6",
"next": "12.2",
"particles.js": "^2.0.0",
"react": "^18.2.0",
"react-circular-progressbar": "^2.1.0",
"react-dom": "^18.2.0",
"react-lightgallery": "^0.9.0",
"react-modal": "^3.15.1",
"react-modal-video": "^1.2.10",
"react-tabs": "^5.1.0",
"react-type-animation": "^1.1.3",
"react-water-wave": "^2.0.1",
"swiper": "^8.3.2"
},
"devDependencies": {
"eslint": "8.23.0",
"eslint-config-next": "12.2.5"
}
}
Next.js, all work fine on localhost, when I push to Heroku, Push rejected, idk why. Please help my heroes.
Thanks for your help.
Push Next.js app to Heroku, Push rejected.
I am working on a project that runs on node 10, "react": "^17.0.1".
"react-scripts": "^4.0.1",
On each project start is shows many warnings, for example usage o == instead of ===, etc.
Here is part of the scripts, start original, the other 3 added by me trying to find a solution:
"scripts": {
"start": "env-cmd -f .env.dev --use-shell \"react-scripts start\"",
"lint": "eslint src --ext .js,.jsx",
"lint:fix": "npm run lint -- --fix",
"eslint": "eslint \"src/**/*.{js,jsx}\" --fix"
},
I wanted to run eslint to automatically fix warnings. I tried the commands:
eslint "src/**/*.{js,jsx}" --fix
npm run eslint;
npm run lint
No matter what command I run I get such error message:
✖ 312 problems (3 errors, 309 warnings)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! company#1.0.0 lint: `eslint src --ext .js,.jsx`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the company#1.0.0 lint 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/myname/.npm/_logs/2022-04-14T12_48_51_948Z-debug.log
Or:
✖ 312 problems (3 errors, 309 warnings)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! company#1.0.0 lint: `eslint src --ext .js,.jsx "--fix"`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the company#1.0.0 lint 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/myname/.npm/_logs/2022-04-14T12_57_18_764Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! company#1.0.0 lint:fix: `npm run lint -- --fix`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the company#1.0.0 lint:fix 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/myname/.npm/_logs/2022-04-14T12_57_18_794Z-debug.log
in the package.json there is this info:
"eslintConfig": {
"extends": [
"react-app"
]
},
No eslink packages installed in package.json - is should be using the react-scripts embedded eslint.
Does anybody have a clue how to make eslint fix a plenty of warnings nobody cared about?
EDIT:
Maybe this error appears after the list of warning, because in the middle there are also few errors such as:
here path to the file
10:41 error React Hook "useState" is called in function "betaBanner" that is neither a React function component nor a custom React Hook function. React component names must start with an uppercase letter react-hooks/rules-of-hooks
EDIT 2:
Yes, after I manually corrected the two errors it now writes in yellow ✖ 309 problems (0 errors, 309 warnings) and the error at the end disappeared.
Sometimes reinstalling the node_modules fixes such issues for me.
These are the steps I follow:
Clean npm cache : npm cache clean --force
Delete the node_modules folder and package-lock.json file.
Do a fresh package install : npm install
Start project : npm start
For VS Code, you can try adding these settings in your VS Code settings.json
"editor.formatOnSave": true,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true,
"source.fixAll.tslint": true,
"source.fixAll.stylelint": true
},
Add this config to your .eslintrc configuration file
"react-hooks/exhaustive-deps": [
"warn",
{
"enableDangerousAutofixThisMayCauseInfiniteLoops": true
}
]
Read more about the issue here https://github.com/facebook/react/issues/18235#issuecomment-898636301
---------ISSUE RESOLVED - SOLUTION AT THE END OF QUESTION--------
I was trying to install Material UI Icons in my Netflix-Clone React.js project with npm, but I got the following error -
PS D:\REACT Projects\netflix> npm i #mui/icons-material #mui/material
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: netflix#0.1.0
npm ERR! Found: react#18.0.0
npm ERR! node_modules/react
npm ERR! react#"^18.0.0" from the root project
npm ERR! peer react#">=16.8.0" from #emotion/react#11.8.2
npm ERR! node_modules/#emotion/react
npm ERR! peerOptional #emotion/react#"^11.5.0" from #mui/material#5.5.3
npm ERR! node_modules/#mui/material
npm ERR! #mui/material#"^5.5.3" from the root project
npm ERR! 1 more (#mui/icons-material)
npm ERR! peer #emotion/react#"^11.0.0-rc.0" from #emotion/styled#11.8.1
npm ERR! node_modules/#emotion/styled
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/material#5.5.3
npm ERR! node_modules/#mui/material
npm ERR! #mui/material#"^5.5.3" from the root project
npm ERR! 1 more (#mui/icons-material)
npm ERR! 1 more (#emotion/styled)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^17.0.0" from #mui/material#5.5.3
npm ERR! node_modules/#mui/material
npm ERR! #mui/material#"^5.5.3" from the root project
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.5.1
npm ERR! node_modules/#mui/icons-material
npm ERR! #mui/icons-material#"^5.5.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
Below is my package.json file -
{
"name": "netflix",
"version": "0.1.0",
"private": true,
"dependencies": {
"#mui/icons-material": "^5.5.1",
"#mui/material": "^5.5.3",
"#testing-library/jest-dom": "^5.16.3",
"#testing-library/react": "^13.0.0",
"#testing-library/user-event": "^14.0.4",
"react": "^18.0.0",
"react-dom": "^18.0.0",
"react-scripts": "5.0.0",
"sass": "^1.49.10",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
I saw a stackoverflow post with similar issue, and tried implementing the solutions mentioned there, but was unsuccessful.
At first, I retried this command with --force -
npm i #mui/icons-material #mui/material --force
This allowed me to install the MUI Icons package without any error, however, I faced numerous errors when I tried to use the icons in my project.
Next, I changed the react and react-dom versions to 16.8.0 in the package.json file, and hit npm install. However, this time also I got the following error -
PS D:\REACT Projects\netflix> npm install
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: netflix#0.1.0
npm ERR! Found: react#16.14.0
npm ERR! node_modules/react
npm ERR! react#"^16.8.0" from the root project
npm ERR! peer react#">=16.8.0" from #emotion/react#11.8.2
npm ERR! node_modules/#emotion/react
npm ERR! peerOptional #emotion/react#"^11.5.0" from #mui/material#5.5.3
npm ERR! node_modules/#mui/material
npm ERR! #mui/material#"^5.5.3" from the root project
npm ERR! 1 more (#mui/icons-material)
npm ERR! peer #emotion/react#"^11.0.0-rc.0" from #emotion/styled#11.8.1
npm ERR! node_modules/#emotion/styled
npm ERR! peerOptional #emotion/styled#"^11.3.0" from #mui/material#5.5.3
npm ERR! node_modules/#mui/material
npm ERR! #mui/material#"^5.5.3" from the root project
npm ERR! 1 more (#mui/icons-material)
npm ERR! 1 more (#emotion/styled)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react#"^17.0.0" from #mui/material#5.5.3
npm ERR! node_modules/#mui/material
npm ERR! #mui/material#"^5.5.3" from the root project
npm ERR! peer #mui/material#"^5.0.0" from #mui/icons-material#5.5.1
npm ERR! node_modules/#mui/icons-material
npm ERR! #mui/icons-material#"^5.5.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
I honestly don't know what to do now. I thought there would be a better solution available on the internet, but everywhere I see the same answers, either to use --force/--legacy-peer-deps or to downgrade my react/react-dom version. As explained above, none of these options are working.
Is there any better solution to this? I'm honestly surprised that such a well-known package would have this many problems while installing.
EDIT - Issue Resolved
Thanks to #ckesplin's help, it finally worked. I followed the below steps -
Executed npx create-react-app netflix.
Changed react and react-dom version to 17.0.0 from 18.0.0.
Deleted package-lock.json file and node_modules folder.
Then hit npm install.
Executed npm i #mui/icons-material #mui/material... it installed successfully.
However, while using an icon, I again got a bunch of errors for Module not found: Can't resolve #emotion/styled. So I had to npm i #emotion/react #emotion/styled
It appears by the log that #mui/material#5.5.3 requires react#"^17.0.0". (You attempted both react 18.0.0 and 16.14.0, but not ^17.0.0)
Replace the following inside of your package.json and give it the ol' npm install
"dependencies": {
...
"react": "^17.0.0",
"react-dom": "^17.0.0",
...
},
This has happened with me too you can install it using --force at the last of the command.
npm i material-ui --force
try the command with --force.
npm i #mui/icons-material #mui/material --force. this worked for me.
I'm stuck at deploying my reactJS web application to Heroku.
It worked fine on the local machine. I got problems with permission when Build section runs.
I don't know what did I wrong, everything else in this course works fine.
I tried to deploy the app with GitHub connection, but I got the same error.
I tried to run this code in terminal NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client, but I got another error (NPM... is not a command).
my package.json file :
{
"name": "contactkeeper",
"version": "1.0.0",
"description": "Contact manager app",
"main": "server.js",
"engines": {
"node": "^12.4.0"
},
"scripts": {
"start": "node server.js",
"server": "nodemon server.js",
"client": "npm start --prefix client",
"clientinstall": "npm install --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"
},
"keywords": [],
"author": "vinogitz",
"license": "ISC",
"dependencies": {
"bcryptjs": "^2.4.3",
"config": "^3.1.0",
"express": "^4.17.1",
"express-validator": "^6.1.1",
"jsonwebtoken": "^8.5.1",
"lodash.template": "^4.5.0",
"mongoose": "^5.6.3"
},
"devDependencies": {
"concurrently": "^4.1.1",
"nodemon": "^1.19.1"
}
}
my gitignore like this:
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
# dependencies
/node_modules
#client/node_modules
/.pnp
.pnp.js
# testing
/coverage
# production
/build
# misc
.DS_Store
.env.local
.env.development.local
.env.test.local
.env.production.local
npm-debug.log*
yarn-debug.log*
yarn-error.log*
-----> Build
Running heroku-postbuild
> contactkeeper#1.0.0 heroku-postbuild /tmp/build_5e4bd7bd79fb3c0f84bb21cb820d7594
> NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client
audited 902208 packages in 13.316s
found 0 vulnerabilities
> client#0.1.0 build /tmp/build_5e4bd7bd79fb3c0f84bb21cb820d7594/client
> react-scripts build
sh: 1: react-scripts: Permission denied
npm ERR! code ELIFECYCLE
npm ERR! errno 126
npm ERR! client#0.1.0 build: `react-scripts build`
npm ERR! Exit status 126
npm ERR!
npm ERR! Failed at the client#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! /tmp/npmcache.BWDxV/_logs/2019-07-22T11_55_03_878Z-debug.log
npm ERR! code ELIFECYCLE
npm ERR! errno 126
npm ERR! contactkeeper#1.0.0 heroku-postbuild: `NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client`
npm ERR! Exit status 126
npm ERR!
npm ERR! Failed at the contactkeeper#1.0.0 heroku-postbuild 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! /tmp/npmcache.BWDxV/_logs/2019-07-22T11_55_03_893Z-debug.log
-----> Build failed
We're sorry this build is failing! You can troubleshoot common issues here:
https://devcenter.heroku.com/articles/troubleshooting-node-deploys
If you're stuck, please submit a ticket so we can help:
https://help.heroku.com/
Love,
Heroku
! Push rejected, failed to compile Node.js app.
! Push failed
I found the problem. the permission denied is not the perfect error message, but i found the solution.
I tried to ignore the node_modules folder in my client folder with .gitignore, but I didn't find the solution first time, so I just delete the sub folder node_modules from project. After that, I tried to deploy it again, and it's worked. So the real problem was that, the git add, git commit, git push commands pushed the node_modules sub folder to the repository.
PS.: The solution is: write node_modules/ instead of /node_modules in gitignore. With this the node_modules folders in a project (root folder or in a sub folder get untracked.)
Thanks!
I've looked through similar stackoverflow questions and none of them seem to work for me. I've been trying to deploy my NodeJS app to Heroku but keep bumping into this message from heroku regarding bower. I have tried manually writing bower in my dependencies but that has not worked, I also tried moving my dependencies from bower.json to package.json but that also didn't work. Thank you guy so much, I have put my heroku logs, package.json, and bower.json files below.
angular-seed#0.0.0 postinstall /tmp/build_370f51a52877a36d300c739f31855511
remote: > bower install
remote:
remote: sh: 1: bower: not found
I have listed below my package.json and my bower.json files.
Package.json
"name": "angular-seed",
"private": true,
"version": "0.0.0",
"description": "A starter project for AngularJS",
"repository": "https://github.com/angular/angular-seed",
"license": "MIT",
"devDependencies": {
"bower": "^1.7.7",
"http-server": "^0.9.0",
"jasmine-core": "^2.4.1",
"karma": "^0.13.22",
"karma-chrome-launcher": "^0.2.3",
"karma-firefox-launcher": "^0.1.7",
"karma-jasmine": "^0.3.8",
"karma-junit-reporter": "^0.4.1",
"protractor": "^3.2.2"
},
"scripts": {
"postinstall": "bower install",
"prestart": "npm install",
"start": "http-server -a localhost -p 8000 -c-1 ./app",
"pretest": "npm install",
"test": "karma start karma.conf.js",
"test-single-run": "karma start karma.conf.js --single-run",
"preupdate-webdriver": "npm install",
"update-webdriver": "webdriver-manager update",
"preprotractor": "npm run update-webdriver",
"protractor": "protractor e2e-tests/protractor.conf.js",
},
"dependencies":{
"bower": "^1.7.9"
}
}
Bower.json
{
"name": "angular-seed",
"description": "A starter project for AngularJS",
"version": "0.0.0",
"homepage": "https://github.com/angular/angular-seed",
"license": "MIT",
"private": true,
"dependencies": {
"angular": "~1.5.0",
"angular-route": "~1.5.0",
"angular-loader": "~1.5.0",
"angular-mocks": "~1.5.0",
"html5-boilerplate": "^5.3.0"
}
}
Heroku
remote: -----> Creating runtime environment
remote: NPM_CONFIG_LOGLEVEL=error
remote: NPM_CONFIG_PRODUCTION=true
remote: NODE_ENV=production
remote: NODE_MODULES_CACHE=true
remote: -----> Installing binaries
remote: engines.node (package.json): unspecified
remote: engines.npm (package.json): unspecified (use default)
remote: Resolving node version (latest stable) via semver.io...
remote: Downloading and installing node 5.11.1...
remote: Using default npm version: 3.8.6
remote: -----> Restoring cache
remote: Skipping cache restore (new runtime signature)
remote: -----> Building dependencies
remote: Installing node modules (package.json)
remote: > angular-seed#0.0.0 postinstall /tmp/build_73e84e8327fb8bcb9b0e1cdc47631bca
remote: > bower install
remote: sh: 1: bower: not found
remote: npm ERR! Linux 3.13.0-95-generic
remote: npm ERR! argv
/tmp/build_73e84e8327fb8bcb9b0e1cdc47631bca/.heroku/node/bin/node" "/tmp/build_73e84e8327fb8bcb9b0e1cdc47631bca/.heroku/node/bin/npm" "install" "--unsafe-perm" "--userconfig" "/tmp/build_73e84e8327fb8bcb9b0e1cdc47631bca/.npmrc"
remote: npm ERR! node v5.11.1
remote: npm ERR! npm v3.8.6
remote: npm ERR! file sh
remote: npm ERR! code ELIFECYCLE
remote: npm ERR! errno ENOENT
remote: npm ERR! syscall spawn
remote: npm ERR! angular-seed#0.0.0 postinstall: `bower install`
remote: npm ERR! spawn ENOENT
remote: npm ERR!
remote: npm ERR! Failed at the angular-seed#0.0.0 postinstall script
bower install'.
remote: npm ERR! Make sure you have the latest version of node.js and npm installed.
remote: npm ERR! If you do, this is most likely a problem with the angular-seed package,
remote: npm ERR! not with npm itself.
remote: npm ERR! Tell the author that this fails on your system:
remote: npm ERR! bower install
remote: npm ERR! You can get information on how to open an issue for this project with
remote: npm ERR! npm bugs angular-seed
remote: npm ERR! Or if that isn't available, you can get their info via:
remote: npm ERR! npm owner ls angular-seed
remote: npm ERR! There is likely additional logging output above.
remote: npm ERR! Please include the following file with any support
remote: npm ERR! /tmp/build_73e84e8327fb8bcb9b0e1cdc47631bca/npm-debug.log
remote: -----> Build failed
Try this instead for the postinstall:
"postinstall": "./node_modules/bower/bin/bower install"
This is because bower is installed locally in the specified path, not globally.