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"
    ]
  }
}

CodePudding user response：

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:

npm install react@latest react-dom@latest

That should modify your package-lock.json. Then try installing from the lock file again with npm 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.

CodePudding user response：

1. I install these old packages with npm install --force
2. I run npm outdated
3. I see what packages are in red
4. I do upgrade from the current version to the wanted version with npm install --save packagename@wanted_version
5. Remove any empty files that you may have in your project
6. Uploaded to git
7. Deploy to Heroku