Search code examples
reactjsherokudeploymentbuildpack

Deploying create-react-app project isn't uglifying my code

This is my first time trying to deploy a React application. I use Heroku and I added the create-react-app build pack to my settings in Heroku. The application is deploying fine except that when I go to inspect the application with Chrome's developer tools, all of the code is readable. Nothing is minimized and the deployment read out is stating that its about 64MB in size which is pretty sizeable considering this is a simple minesweeper game I wrote as I am currently learning React.

I see that I can run yarn build locally for production files but Heroku should be doing that (and it claims to be doing it) in the deployment process. Here is the full deployment log (and the url to application is at the bottom of the log if you want to see for yourself that the code isn't compressed at all.

Also, I have both the heroku/nodejs and create-react-app build packs added.

Counting objects: 5, done.
Delta compression using up to 8 threads.
Compressing objects: 100% (3/3), done.
Writing objects: 100% (3/3), 447 bytes | 0 bytes/s, done.
Total 3 (delta 2), reused 0 (delta 0)
remote: Compressing source files... done.
remote: Building source:
remote: 
remote: -----> Node.js app detected
remote:        
remote: -----> Creating runtime environment
remote:        
remote:        NPM_CONFIG_LOGLEVEL=error
remote:        NODE_ENV=production
remote:        NODE_MODULES_CACHE=true
remote:        NODE_VERBOSE=false
remote:        
remote: -----> Installing binaries
remote:        engines.node (package.json):  10.16.3
remote:        engines.npm (package.json):   6.11.3
remote:        engines.yarn (package.json):  unspecified (use default)
remote:        
remote:        Resolving node version 10.16.3...
remote:        Downloading and installing node 10.16.3...
remote:        Bootstrapping npm 6.11.3 (replacing 6.9.0)...
remote:        npm 6.11.3 installed
remote:        Resolving yarn version 1.x...
remote:        Downloading and installing yarn (1.19.1)...
remote:        Installed yarn 1.19.1
remote:        
remote: -----> Restoring cache
remote:        - yarn cache
remote:        
remote: -----> Installing dependencies
remote:        Installing node modules (yarn.lock)
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 24.67s.
remote:        
remote: -----> Build
remote:        Running build (yarn)
remote:        yarn run v1.19.1
remote:        $ react-scripts build
remote:        Creating an optimized production build...
remote:        Compiled successfully.
remote:        
remote:        File sizes after gzip:
remote:        
remote:          55.27 KB  build/static/js/2.51ce75d4.chunk.js
remote:          22.16 KB  build/static/css/2.266e55a5.chunk.css
remote:          7.28 KB   build/static/js/main.85808fae.chunk.js
remote:          922 B     build/static/css/main.1b212574.chunk.css
remote:          772 B     build/static/js/runtime-main.135745f3.js
remote:        
remote:        The project was built assuming it is hosted at the server root.
remote:        You can control this with the homepage field in your package.json.
remote:        For example, add this to build it for GitHub Pages:
remote:        
remote:          "homepage" : "http://myname.github.io/myapp",
remote:        
remote:        The build folder is ready to be deployed.
remote:        You may serve it with a static server:
remote:        
remote:          yarn global add serve
remote:          serve -s build
remote:        
remote:        Find out more about deployment here:
remote:        
remote:          <removed url because stack overflow complained>
remote:        
remote:        Done in 30.84s.
remote:        
remote: -----> Pruning devDependencies
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        warning Ignored scripts due to flag.
remote:        Done in 10.24s.
remote:        
remote: -----> Caching build
remote:        - yarn cache
remote:        
remote: -----> Build succeeded!
remote:  !     Unmet dependencies don't fail yarn install but may cause runtime issues
remote:        https://github.com/npm/npm/issues/7494
remote: 
remote: -----> React.js (create-react-app) multi app detected
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:        NODE_HOME=/tmp/build_8f502a2ec1527c68927f7b22b403c03a/.heroku/node
remote:        NODE_ENV=production
remote:        NODE_MODULES_CACHE=true
remote:        NODE_VERBOSE=false
remote:        
remote: -----> Installing binaries
remote:        engines.node (package.json):  10.16.3
remote:        engines.npm (package.json):   6.11.3
remote:        engines.yarn (package.json):  unspecified (use default)
remote:        
remote:        Resolving node version 10.16.3...
remote:        Downloading and installing node 10.16.3...
remote:        Bootstrapping npm 6.11.3 (replacing 6.9.0)...
remote:        npm 6.11.3 installed
remote:        Resolving yarn version 1.x...
remote:        Downloading and installing yarn (1.19.1)...
remote:        Installed yarn 1.19.1
remote:         !     node_modules checked into source control
remote:               https://blog.heroku.com/node-habits-2016#9-only-git-the-important-bits
remote:        
remote:        
remote: -----> Restoring cache
remote:        Cached directories were not restored due to a change in version of node, npm, yarn or stack
remote:        Module installation may take longer for this build
remote:        
remote: -----> Installing dependencies
remote:        Installing node modules (yarn.lock)
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 49.98s.
remote:        
remote: -----> Build
remote:        Running build (yarn)
remote:        yarn run v1.19.1
remote:        $ react-scripts build
remote:        Creating an optimized production build...
remote:        Compiled successfully.
remote:        
remote:        File sizes after gzip:
remote:        
remote:          55.27 KB  build/static/js/2.51ce75d4.chunk.js
remote:          22.16 KB  build/static/css/2.266e55a5.chunk.css
remote:          7.28 KB   build/static/js/main.85808fae.chunk.js
remote:          922 B     build/static/css/main.1b212574.chunk.css
remote:          772 B     build/static/js/runtime-main.135745f3.js
remote:        
remote:        The project was built assuming it is hosted at the server root.
remote:        You can control this with the homepage field in your package.json.
remote:        For example, add this to build it for GitHub Pages:
remote:        
remote:          "homepage" : "http://myname.github.io/myapp",
remote:        
remote:        The build folder is ready to be deployed.
remote:        You may serve it with a static server:
remote:        
remote:          yarn global add serve
remote:          serve -s build
remote:        
remote:        Find out more about deployment here:
remote:        
remote:          <removed url because stackoverflow complained>
remote:        
remote:        Done in 31.08s.
remote:        
remote: -----> Pruning devDependencies
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        warning Ignored scripts due to flag.
remote:        Done in 10.34s.
remote:        
remote: -----> Caching build
remote:        - yarn cache
remote:        
remote: -----> Build succeeded!
remote:  !     Unmet dependencies don't fail yarn install but may cause runtime issues
remote:        https://github.com/npm/npm/issues/7494
remote: 
remote: =====> Downloading Buildpack: https://github.com/mars/create-react-app-inner-buildpack.git
remote: =====> Detected Framework: React.js (create-react-app)
remote:        Writing `static.json` to support create-react-app
remote:        Enabling runtime environment variables
remote: =====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-static.git
remote: =====> Detected Framework: Static HTML
remote:   % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
remote:                                  Dload  Upload   Total   Spent    Left  Speed
remote: 100  838k  100  838k    0     0  14.3M      0 --:--:-- --:--:-- --:--:-- 14.1M
remote: -----> Installed directory to /app/bin
remote: Using release configuration from last framework (Static HTML).
remote: -----> Discovering process types
remote:        Procfile declares types     -> (none)
remote:        Default types for buildpack -> web
remote: 
remote: -----> Compressing...
remote:        Done: 65M
remote: -----> Launching...
remote:        Released v5
remote:        https://still-headland-77198.herokuapp.com/ deployed to Heroku
remote: 
remote: Verifying deploy... done.
To https://git.heroku.com/still-headland-77198.git
   28ed634..60391e2  master -> master

EDIT: below is a photo of what I'm seeing when I inspect the web site:

enter image description here

EDIT #2: So it looks like the static files are being sent correctly, but its the source maps that are viewable through the browser developer tools.

When I do a full page reload, this is what heroku logs output I get:

2019-10-15T13:22:09.316671+00:00 heroku[router]: at=info method=GET path="/" host=still-headland-77198.herokuapp.com request_id=27e961ec-3a0a-48dd-a23f-19347df72d65 fwd="67.166.153.94" dyno=web.1 connect=0ms service=5ms status=200 bytes=1147 protocol=https
2019-10-15T13:22:09.589611+00:00 heroku[router]: at=info method=GET path="/static/js/bundle.js" host=still-headland-77198.herokuapp.com request_id=ebe2c750-2783-4558-8f40-d92d70b7b05e fwd="67.166.153.94" dyno=web.1 connect=0ms service=19ms status=200 bytes=6709 protocol=https
2019-10-15T13:22:09.788537+00:00 heroku[router]: at=info method=GET path="/static/js/main.chunk.js" host=still-headland-77198.herokuapp.com request_id=e2c77a25-0b40-4f02-a24f-ab64c4fd588d fwd="67.166.153.94" dyno=web.1 connect=0ms service=29ms status=200 bytes=14484 protocol=https
2019-10-15T13:22:10.04068+00:00 heroku[router]: at=info method=GET path="/static/js/0.chunk.js" host=still-headland-77198.herokuapp.com request_id=c9554914-d290-4d3e-a3fd-df18f0cc6869 fwd="67.166.153.94" dyno=web.1 connect=0ms service=288ms status=200 bytes=590301 protocol=https
2019-10-15T13:22:10.852381+00:00 heroku[router]: at=info method=GET path="/favicon.ico" host=still-headland-77198.herokuapp.com request_id=4b503f0b-7ab5-4d40-8c9f-4b3564efc05c fwd="67.166.153.94" dyno=web.1 connect=0ms service=15ms status=200 bytes=1936 protocol=https
2019-10-15T13:22:10.857839+00:00 heroku[router]: at=info method=GET path="/favicon.ico" host=still-headland-77198.herokuapp.com request_id=1e33ae5e-8909-44a9-b1b2-4672c75e8293 fwd="67.166.153.94" dyno=web.1 connect=0ms service=15ms status=200 bytes=1936 protocol=https
2019-10-15T13:22:10.880865+00:00 heroku[router]: at=info method=GET path="/sockjs-node/info?t=1571145724205" host=still-headland-77198.herokuapp.com request_id=a19d69ab-9d04-46a6-9bff-9914734597e0 fwd="67.166.153.94" dyno=web.1 connect=0ms service=4ms status=200 bytes=363 protocol=https

EDIT #3 (Full sanity check with logs): (btw gits is just an alias for git status I use.

 react-minesweeper ruby-2.6.3 git:(master) gits
On branch master
Your branch is up-to-date with 'origin/master'.

nothing to commit, working directory clean
 react-minesweeper ruby-2.6.3 git:(master) git commit --allow-empty
[master d86dc63] Another test for deploying.
 react-minesweeper ruby-2.6.3 git:(master) gits
On branch master
Your branch is ahead of 'origin/master' by 1 commit.
  (use "git push" to publish your local commits)

nothing to commit, working directory clean
 react-minesweeper ruby-2.6.3 git:(master) heroku maintenance:on 
Enabling maintenance mode for ⬢ still-headland-77198... done
 react-minesweeper ruby-2.6.3 git:(master) git push heroku master
Counting objects: 1, done.
Writing objects: 100% (1/1), 194 bytes | 0 bytes/s, done.
Total 1 (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: =====> 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:        NODE_ENV=production
remote:        NODE_MODULES_CACHE=true
remote:        NODE_VERBOSE=false
remote:        
remote: -----> Installing binaries
remote:        engines.node (package.json):  10.16.3
remote:        engines.npm (package.json):   6.11.3
remote:        engines.yarn (package.json):  unspecified (use default)
remote:        
remote:        Resolving node version 10.16.3...
remote:        Downloading and installing node 10.16.3...
remote:        Bootstrapping npm 6.11.3 (replacing 6.9.0)...
remote:        npm 6.11.3 installed
remote:        Resolving yarn version 1.x...
remote:        Downloading and installing yarn (1.19.1)...
remote:        Installed yarn 1.19.1
remote:        
remote: -----> Restoring cache
remote:        Cached directories were not restored due to a change in version of node, npm, yarn or stack
remote:        Module installation may take longer for this build
remote:        
remote: -----> Installing dependencies
remote:        Installing node modules (yarn.lock)
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 45.13s.
remote:        
remote: -----> Build
remote:        Running build (yarn)
remote:        yarn run v1.19.1
remote:        $ GENERATE_SOURCEMAP=false react-scripts build
remote:        Creating an optimized production build...
remote:        Compiled successfully.
remote:        
remote:        File sizes after gzip:
remote:        
remote:          55.22 KB  build/static/js/2.51ce75d4.chunk.js
remote:          22.12 KB  build/static/css/2.56d65a16.chunk.css
remote:          7.21 KB   build/static/js/main.507a084d.chunk.js
remote:          882 B     build/static/css/main.edf481ed.chunk.css
remote:          728 B     build/static/js/runtime-main.135745f3.js
remote:        
remote:        The project was built assuming it is hosted at the server root.
remote:        You can control this with the homepage field in your package.json.
remote:        For example, add this to build it for GitHub Pages:
remote:        
remote:          "homepage" : "http://myname.github.io/myapp",
remote:        
remote:        The build folder is ready to be deployed.
remote:        You may serve it with a static server:
remote:        
remote:          yarn global add serve
remote:          serve -s build
remote:        
remote:        Find out more about deployment here:
remote:        
remote:          
remote:        
remote:        Done in 29.10s.
remote:        
remote: -----> Pruning devDependencies
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        warning Ignored scripts due to flag.
remote:        Done in 10.39s.
remote:        
remote: -----> Caching build
remote:        - yarn cache
remote:        
remote: -----> Build succeeded!
remote:  !     Unmet dependencies don't fail yarn install but may cause runtime issues
remote:        https://github.com/npm/npm/issues/7494
remote: 
remote: =====> Downloading Buildpack: https://github.com/mars/create-react-app-inner-buildpack.git
remote: =====> Detected Framework: React.js (create-react-app)
remote:        Using existing `static.json`
remote:        Enabling runtime environment variables
remote: =====> Downloading Buildpack: https://github.com/heroku/heroku-buildpack-static.git
remote: =====> Detected Framework: Static HTML
remote:   % Total    % Received % Xferd  Average Speed   Time    Time     Time  Current
remote:                                  Dload  Upload   Total   Spent    Left  Speed
remote: 100  838k  100  838k    0     0  9983k      0 --:--:-- --:--:-- --:--:-- 9983k
remote: -----> Installed directory to /app/bin
remote: Using release configuration from last framework (Static HTML).
remote: -----> Node.js app detected
remote:        
remote: -----> Creating runtime environment
remote:        
remote:        NPM_CONFIG_LOGLEVEL=error
remote:        NODE_ENV=production
remote:        NODE_MODULES_CACHE=true
remote:        NODE_VERBOSE=false
remote:        
remote: -----> Installing binaries
remote:        engines.node (package.json):  10.16.3
remote:        engines.npm (package.json):   6.11.3
remote:        engines.yarn (package.json):  unspecified (use default)
remote:        
remote:        Resolving node version 10.16.3...
remote:        Downloading and installing node 10.16.3...
remote:        Bootstrapping npm 6.11.3 (replacing 6.9.0)...
remote:        npm 6.11.3 installed
remote:        Resolving yarn version 1.x...
remote:        Downloading and installing yarn (1.19.1)...
remote:        Installed yarn 1.19.1
remote:         !     node_modules checked into source control
remote:               https://blog.heroku.com/node-habits-2016#9-only-git-the-important-bits
remote:        
remote:        
remote: -----> Restoring cache
remote:        Cached directories were not restored due to a change in version of node, npm, yarn or stack
remote:        Module installation may take longer for this build
remote:        
remote: -----> Installing dependencies
remote:        Installing node modules (yarn.lock)
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 48.75s.
remote:        
remote: -----> Build
remote:        Running build (yarn)
remote:        yarn run v1.19.1
remote:        $ GENERATE_SOURCEMAP=false react-scripts build
remote:        Creating an optimized production build...
remote:        Compiled successfully.
remote:        
remote:        File sizes after gzip:
remote:        
remote:          55.22 KB  build/static/js/2.51ce75d4.chunk.js
remote:          22.12 KB  build/static/css/2.56d65a16.chunk.css
remote:          7.21 KB   build/static/js/main.507a084d.chunk.js
remote:          882 B     build/static/css/main.edf481ed.chunk.css
remote:          728 B     build/static/js/runtime-main.135745f3.js
remote:        
remote:        The project was built assuming it is hosted at the server root.
remote:        You can control this with the homepage field in your package.json.
remote:        For example, add this to build it for GitHub Pages:
remote:        
remote:          "homepage" : "http://myname.github.io/myapp",
remote:        
remote:        The build folder is ready to be deployed.
remote:        You may serve it with a static server:
remote:        
remote:          yarn global add serve
remote:          serve -s build
remote:        
remote:        Find out more about deployment here:
remote:        
remote:         
remote:        
remote:        Done in 29.96s.
remote:        
remote: -----> Pruning devDependencies
remote:        yarn install v1.19.1
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@2.0.7: The platform "linux" is incompatible with this module.
remote:        info "fsevents@2.0.7" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        info fsevents@1.2.9: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.9" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "jquery@1.9.1 - 3".
remote:        warning " > bootstrap@4.3.1" has unmet peer dependency "popper.js@^1.14.7".
remote:        warning " > react-timer-hook@1.1.7" has incorrect peer dependency "react-dom@16.8.0".
remote:        [4/4] Building fresh packages...
remote:        warning Ignored scripts due to flag.
remote:        Done in 10.38s.
remote:        
remote: -----> Caching build
remote:        - yarn cache
remote:        
remote: -----> Build succeeded!
remote:  !     Unmet dependencies don't fail yarn install but may cause runtime issues
remote:        https://github.com/npm/npm/issues/7494
remote: 
remote: -----> Discovering process types
remote:        Procfile declares types     -> (none)
remote:        Default types for buildpack -> web
remote: 
remote: -----> Compressing...
remote:        Done: 64.6M
remote: -----> Launching...
remote:        Released v11
remote:        https://still-headland-77198.herokuapp.com/ deployed to Heroku
remote: 
remote: Verifying deploy... done.
To https://git.heroku.com/still-headland-77198.git
   a654077..d86dc63  master -> master
 react-minesweeper ruby-2.6.3 git:(master) heroku maintenance:off
Disabling maintenance mode for ⬢ still-headland-77198... done
Solution

  • By default Create-React-App has GENERATE_SOURCEMAP flag set to TRUE. It means that creating production build will generate additional source maps to your js files = you can see non-compiled code in Chrome's developer tools.

    To fix that you should add GENERATE_SOURCEMAP=false to your envs on Heroku or add into package.json:

    "scripts": {    
    "start": "react-scripts start",
    "build": "GENERATE_SOURCEMAP=false react-scripts build",
}

    If it comes to deploying on Heroku then just make sure that your static.json (in root directory) looks something like this: https://github.com/mars/create-react-app-buildpack#web-server

    {
  "root": "build/",
}

    More information about this buildpack that you use: https://github.com/mars/create-react-app-buildpack

    Done: 65M - this is a size of your deployment bundle along with Node.js and your small code. I think you shouldn't bother about that as this is normal situation.

    Edit: If the solutions above don't work then please make sure that you serve the newest index.html with hashes in js imports. This article might be helpful: How to deploy a production react app to heroku