Greetings I have a problem with Heroku because it’s don’t want to install legacy packages for my Shopify app, my Shopify app is on Github and I just set up everything that my application needs, but when I deploy the main branch on Heroku I get this error in Heroku console below, can someone help me fix this?
-----> Building on the Heroku-20 stack
-----> Using buildpack: heroku/nodejs
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
USE_NPM_INSTALL=true
NODE_VERBOSE=false
NODE_ENV=production
NODE_MODULES_CACHE=false
-----> Installing binaries
engines.node (package.json): unspecified
engines.npm (package.json): unspecified (use default)
Resolving node version 16.x...
Downloading and installing node 16.14.0...
Using default npm version: 8.3.1
-----> Restoring cache
Caching has been disabled because NODE_MODULES_CACHE=false
-----> Installing dependencies
Installing node modules (package.json + package-lock)
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: [email protected]
npm ERR! Found: [email protected]
npm ERR! node_modules/react
npm ERR! react@"^16.10.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^17.0.2 || ^18.0.0-0" from [email protected]
npm ERR! node_modules/next
npm ERR! next@"^12.0.2" 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.
npm ERR!
npm ERR! See /tmp/npmcache.CTfHl/eresolve-report.txt for a full report.
npm ERR! A complete log of this run can be found in:
npm ERR! /tmp/npmcache.CTfHl/_logs/2022-02-10T12_18_50_156Z-debug-0.log
-----> Build failed
We're sorry this build is failing! You can troubleshoot common issues here:
https://devcenter.heroku.com/articles/troubleshooting-node-deploys
Some possible problems:
- Node version not specified in package.json
https://devcenter.heroku.com/articles/nodejs-support#specifying-a-node-js-version
Love,
Heroku
! Push rejected, failed to compile Node.js app.
! Push failed
My package.json
{
"name": "shopify-app-node",
"version": "1.0.0",
"description": "Shopify's node app for CLI tool",
"scripts": {
"test": "jest",
"dev": "cross-env NODE_ENV=development nodemon ./server/index.js --watch ./server/index.js",
"build": "NEXT_TELEMETRY_DISABLED=1 next build",
"start": "cross-env NODE_ENV=production node ./server/index.js"
},
"engines": {
"node": "16.14.0",
"npm": "8.4.1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/Shopify/shopify-app-node.git"
},
"author": "Shopify Inc.",
"license": "MIT",
"bugs": {
"url": "https://github.com/shopify/shopify-app-node/issues"
},
"dependencies": {
"@babel/core": "7.12.10",
"@babel/polyfill": "^7.6.0",
"@babel/preset-env": "^7.12.11",
"@babel/register": "^7.12.10",
"@shopify/app-bridge-react": "^2.0.2",
"@shopify/app-bridge-utils": "^2.0.2",
"@shopify/koa-shopify-auth": "^4.1.2",
"@shopify/polaris": "^6.2.0",
"apollo-boost": "^0.4.9",
"axios": "^0.25.0",
"cross-env": "^7.0.3",
"dotenv": "^8.2.0",
"graphql": "^14.5.8",
"isomorphic-fetch": "^3.0.0",
"koa": "^2.13.1",
"koa-bodyparser": "^4.3.0",
"koa-compress": "^5.1.0",
"koa-cors": "0.0.16",
"koa-logger": "^3.2.1",
"koa-router": "^10.0.0",
"koa-session": "^6.1.0",
"mysql2": "^2.3.3",
"next": "^12.0.2",
"next-env": "^1.1.0",
"node-fetch": "^2.6.7",
"react": "^16.10.1",
"react-apollo": "^3.1.3",
"react-dom": "^16.10.1",
"sequelize": "^6.13.0",
"slugify": "^1.6.5",
"validator": "^13.7.0",
"webpack": "^4.44.1"
},
"devDependencies": {
"@babel/plugin-transform-runtime": "^7.12.10",
"@babel/preset-stage-3": "^7.0.0",
"babel-jest": "26.6.3",
"babel-register": "^6.26.0",
"enzyme": "3.11.0",
"enzyme-adapter-react-16": "1.15.6",
"husky": "^4.3.6",
"jest": "26.6.3",
"lint-staged": "^10.5.4",
"nodemon": "^2.0.7",
"prettier": "2.2.1",
"react-addons-test-utils": "15.6.2",
"react-test-renderer": "16.14.0"
},
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.{js,css,json,md}": [
"prettier --write"
]
}
}
6
Answers
npm install --force
npm outdated
npm install --save packagename@wanted_version
Your lock file contains conflicting dependencies. Since you were able to reproduce the error locally using
npm ci
we have a good way to test a fix locally.It looks like you are depending directly on React 16. Is that something that you need directly, or is it just a dependency for Next.js?
If it’s not something you need directly, upgrade it per the Next.js docs:
That should modify your
package-lock.json
. Then try installing from the lock file again withnpm ci
. If that fixes things, commit the change and redeploy.On the other hand, if you are directly depending on React 16 and cannot upgrade you’ll have to consider rolling back to an earlier version of Next.js.
If you cannot reproduce locally, set package.json
engines:
to match your local developmentThis is not the OP’s exact issue as they had specified
engines:
and reproduced locally, so definitely what they needed was to resolve it locally first, which is a subset of the infinite Unable to resolve dependency tree error when installing npm packagesBut I couldn’t reproduce locally even after delting
node_modules
andpackage-lock.json
, so as soon as I setengines:
, which Heroku respects, to match my local working setupnode --version
andnpm --version
with:it started working on Heroku. Here’s my failing package.json to which the
engines
were added. The error was:Prior to the fix, Heroku logs show it was using:
For this reason, you should Always, Always, set
engines
to match your local setup on a Heroku project.Ciro Santilli’s way solved my problem:
I added these lines to package.json and the problem fixed:
Apparently for me the "knex" module that I use is not compatible with newer npm (I am not sure).
You may use
.npmrc
New versions of npm do not allow you to install dependencies with different versions of peer dependencies because it may lead to breaking change. So if you are sure that everything works without any issues, maybe you have good tests. Just add
--legacy-peer-deps
or--force
after your npm script (basically it’snpm i
). But it’s so annoying to write it, instead you can create ‘.npmrc’ file in the root of your project with following:or even:
Now you don’t need to add
--legacy-peer-deps
or--force
manually.ps. It also solves the problem with Heroku when you cannot explicitly use
npm i --legacy-peer-deps
. At least I don’t know how to do so.I found a solution. You can add config variables in Heroku apps.
Go to the app in Heroku -> settings -> Reveal Config Vars
Add a new config var with the key:
NPM_CONFIG_LEGACY_PEER_DEPS
and valuetrue
, and then redeploy.