部署 create-react-app 项目不会丑化我的代码

【问题标题】：Deploying create-react-app project isn't uglifying my code部署 create-react-app 项目不会丑化我的代码
【发布时间】：2020-02-10 01:24:18
【问题描述】：

这是我第一次尝试部署 React 应用程序。我使用 Heroku，并在 Heroku 的设置中添加了 create-react-app 构建包。该应用程序部署良好，但当我使用 Chrome 的开发人员工具检查该应用程序时，所有代码都是可读的。什么都没有最小化，读出的部署表明它的大小约为 64MB，考虑到这是我目前正在学习 React 时编写的一个简单的扫雷游戏，这是相当大的。

我发现我可以在本地运行 yarn build 来获取生产文件，但 Heroku 应该在部署过程中这样做（并且声称正在这样做）。这是完整的部署日志（如果您想亲自查看代码根本没有压缩，应用程序的 url 位于日志的底部。

另外，我添加了 heroku/nodejs 和 create-react-app 构建包。

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

编辑：下面是我检查网站时看到的照片：

编辑#2：所以看起来静态文件正在正确发送，但它的源映射可以通过浏览器开发人员工具查看。

当我重新加载整页时，这是heroku logs 的输出：

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

编辑 #3（使用日志进行全面检查）：（顺便说一句，gits 只是我使用的 git status 的别名。

 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

【问题讨论】：

  • 当你在本地运行yarn build 时，它是否如你所愿？
  • @giuseppedeponte 我在本地运行yarn build，在build 目录下，我有一个static 和一个src 文件夹。 src 文件夹看起来像我的代码（包括 Typescript 文件），但静态文件夹看起来像其中包含压缩的 js/css 文件。您是否认为我的应用程序可能正在运行生产文件，但压缩后留下了 src 文件夹？为什么构建后没有删除该文件夹？
  • 从控制台输出来看，我认为你的 src 文件夹没有被部署。通常只部署 build 文件夹，因为它包含代码的转译和浏览器可理解的版本。无论如何，您可以在在线页面上的浏览器检查器中验证这一点。您将获得应用使用的所有文件的列表。
  • 您还可以查看这些文档以查看您的部署是否一切正常：github.com/mars/create-react-app-buildpack & blog.heroku.com/deploying-react-with-zero-configuration
  • 我正在按照 buildpack 文档中的步骤进行操作，如果您检查项目，您会发现代码并未最小化且易于阅读。在这里，您可以看到我使用快速指南从头开始创建的项目：heroku-deploy-test-01.herokuapp.com 使用 Chrome 开发人员工具，转到 Sources 选项卡并查看 static/js 下的文件，您将看到 App.js 和 index.js are' t 完全压缩。

标签： reactjs heroku deployment buildpack


【解决方案1】：

默认情况下，Create-React-App 将 GENERATE_SOURCEMAP 标志设置为 TRUE。 这意味着创建生产版本会为您的 js 文件生成额外的源映射 = 您可以在 Chrome 的开发人员工具中看到未编译的代码。

要解决这个问题，您应该将 GENERATE_SOURCEMAP=false 添加到 Heroku 上的环境中或添加到 package.json：

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

如果要在 Heroku 上进行部署，请确保您的 static.json（在根目录中）看起来像这样： https://github.com/mars/create-react-app-buildpack#web-server

{
  "root": "build/",
}

关于您使用的这个 buildpack 的更多信息：https://github.com/mars/create-react-app-buildpack

Done: 65M - 这是您的部署包以及 Node.js 和您的小代码的大小。我认为您不应该为此烦恼，因为这是正常情况。

编辑： 如果上述解决方案不起作用，请确保在 js 导入中使用带有哈希的最新 index.html。 这篇文章可能会有所帮助：How to deploy a production react app to heroku

【讨论】：

  • 起初你说要在我的 heroku 环境变量中设置GENERATE_SOUREMAP=true，但后来在package.json 文件中你将它设置为false。我使用您的package.json 示例作为我的解决方案，并将static.json 文件添加到根目录中。尽管如此，我仍然看到开发源文件。我可以编辑我的帖子并显示我所看到内容的屏幕截图。
  • 你是对的。应该是false。我已经编辑了我的答案。
  • @aarona，请再次确保 GENERATE_SOURCEMAP 设置为 false。
  • 好的，这是我的构建脚本："build": "GENERATE_SOURCEMAP=false react-scripts build" 和我的 /static.json 文件的内容：{ "root": "build/" }。另外，我现在正在部署进行测试，这在日志中：$ GENERATE_SOURCEMAP=false react-scripts build。但是，我似乎仍在获取那些源地图。如果我只有一些缓存文件，我尝试使用 Firefox 查看它，但看起来 FF 也有一个 webpack 部分，其中包含文件列表，包括 node_modules 文件夹。请参阅我的第二个帖子编辑。而且，非常感谢您在这方面帮助我。我很感激
  • 你是对的！此外，当我阅读您的评论时，当我将其作为问题发布在 create-react-app github 上时，它证实了其他人的建议。好的，找到了这个：medium.com/jeremy-gottfrieds-tech-blog/…。这行得通！我将 +1 并将您的答案标记为正确，但如果您可以使用所需的信息或可能的 url 来编辑您的答案，以便任何发现此问题的人处理同样的问题，那就太好了。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2019-07-11
  • 2017-09-21
  • 2023-03-02
  • 2019-10-22
  • 2020-08-18
  • 2020-01-27
  • 1970-01-01
相关资源
最近更新 更多
热门标签
Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode