'Getting an error when trying to deploy a react app to heroku

I'm trying to learn how to deploy a react application to heroku, but I keep getting an error message whenever I do a test run.

I've been using the following commands to create a react app and deploy it to heroku:

 $ npx create-react-app struttingpeacocks

 $ cd struttingpeacocks

 $ git init

 $ heroku create struttingpeacocksapp --buildpack https://github.com/mars/create-react-app-buildpack.git

 $ git add .

 $ git commit -m "create-react-app"

 $ git push heroku master

When I do this, though, the following code runs with an error message towards the end:

 $ git push heroku master

 Counting objects: 18, done.

 Delta compression using up to 8 threads.

 Compressing objects: 100% (18/18), done.

 Writing objects: 100% (18/18), 88.11 KiB | 3.26 MiB/s, done.

 Total 18 (delta 0), reused 0 (delta 0)

 remote: Compressing source files... done.

 remote: Building source:

 remote:

 remote: -----> React.js (create-react-app) multi app detected

 remote: -----> Configure create-react-app build environment

 remote:        Using `NODE_ENV=development`

 remote: =====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-multi.git

 remote: =====> Detected Framework: Multipack

 remote: =====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-nodejs.git

 remote: =====> Detected Framework: Node.js

 remote:

 remote: -----> Creating runtime environment

 remote:

 remote:        NPM_CONFIG_LOGLEVEL=error

 remote:        NPM_CONFIG_PRODUCTION=false

 remote:        NODE_ENV=development

 remote:        NODE_MODULES_CACHE=true

 remote:        NODE_VERBOSE=false

 remote:

 remote: -----> Installing binaries

 remote:        engines.node (package.json):  unspecified

 remote:        engines.npm (package.json):   unspecified (use default)

 remote:        engines.yarn (package.json):  unspecified (use default)
 remote:

 remote:        Resolving node version 8.x...

 remote:        Downloading and installing node 8.12.0...

 remote:        Using default npm version: 6.4.1

 remote:        Resolving yarn version 1.x...

 remote:        Downloading and installing yarn (1.12.1)...

 remote:        Installed yarn 1.12.1

 remote:

 remote: -----> Building dependencies

 remote:        Installing node modules (yarn.lock)

 remote:        yarn install v1.12.1

 remote:        [1/4] Resolving packages...

 remote:        error Your lockfile needs to be updated, but yarn was run with `--frozen-lockfile`.

 remote:        info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.

 remote:

 remote: -----> Build failed

 remote:

 remote:  !     Outdated Yarn lockfile

 remote:

 remote:        Your application contains a Yarn lockfile (yarn.lock) which does not

 remote:        match the dependencies in package.json. This can happen if you use npm

 remote:        to install or update a dependency instead of Yarn.

 remote:

 remote:        Please run the following command in your application directory and check

 remote:        in the new yarn.lock file:

 remote:

 remote:        $ yarn install

 remote:        $ git add yarn.lock

 remote:        $ git commit -m "Updated Yarn lockfile"

 remote:        $ git push heroku master

 remote:

 remote:        https://kb.heroku.com/why-is-my-node-js-build-failing-because-of-an-outdated-yarn-lockfile

 remote:

 remote:  !     Push rejected, failed to compile React.js (create-react-app) multi app.

 remote:

 remote:  !     Push failed

 remote: Verifying deploy...

 remote:

 remote: !       Push rejected to struttingpeacocksapp.

 remote:To https://git.heroku.com/struttingpeacocksapp.git

  ! [remote rejected] master -> master (pre-receive hook declined)

 error: failed to push some refs to 'https://git.heroku.com/struttingpeacocksapp.git'

My package.json is the following code

 {
   "name": "struttingpeacocks",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
     "react": "^16.6.0",
     "react-dom": "^16.6.0",
     "react-scripts": "2.1.0"
   },
   "scripts": {
     "start": "react-scripts start",
     "build": "react-scripts build",
     "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
   "eslintConfig": {
     "extends": "react-app"
   },
   "browserslist": [
     ">0.2%",
     "not dead",
     "not ie <= 11",
     "not op_mini all"
   ]
 }

I could really use some help with this. Any advice would be greatly appreciated

Solution 1:^[1]

You should to install this package .

npm i create-app-react 
   or
yarn add create-app-react

And add the version of node and npm to your package.js

`"engines": { "node": "YOUR_VERSION_OF_NODE",
 "npm": "YOUR_VERSION_OF_NPM"}`,

You can find the version by putting node -v npm -v in the cmd

Solution 2:^[2]

Hellow World - Testing to push answers on Stackoverflow. But don't know how to delete it.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1
Solution 2	user18909497

'Getting an error when trying to deploy a react app to heroku

My package.json is the following code

I could really use some help with this. Any advice would be greatly appreciated

Solution 1:[1]

Solution 2:[2]

Sources

Related Questions

Solution 1:^[1]

Solution 2:^[2]