首页 > 解决方案 > 尝试将我的 REACT Webpack 应用程序部署到 heroku。一切都在本地工作,heroku 构建工作。但我得到一个 404 nginx

问题描述

我认为这里的问题是 heroku 在错误的位置搜索我的 bundle.js。

Heroku 正在默认位置('/app/build/static/js/*.js')中寻找我的包,但我已经使用我的 webpack.config 和 static.json 文件中指定的自定义包位置

heroku config:set JS_RUNTIME_TARGET_BUNDLE: /app/dist/*.js

如此处所述(https://github.com/mars/create-react-app-buildpack/blob/master/README.md#user-content-custom-bundle-location)。我是 heroku 的新手,并且在一般编程方面非常缺乏经验,我无法弄清楚为什么 heroku 仍在默认位置寻找我的包。下面是我的 webpack.config 和 static.json 文件中的重要片段。

webpack.config.js

    entry: './src/index.js',
    output: {
        path: path.join(__dirname, '/dist'),
        filename: 'bundle.js'
    },

静态.json

    "root": "dist/",
    "clean_urls": false,
    "routes": {
      "/**": "src/index.html"
    }
  }

当我运行 heroku logs --tail 时,我得到以下信息。如您所见,heroku 正在默认位置寻找我的包。

2019-10-04T02:04:43+00:00 app[api]: Build succeeded
2019-10-04T02:04:55.38611+00:00 heroku[web.1]: Starting process with command `bin/boot`
2019-10-04T02:04:56.977667+00:00 heroku[web.1]: State changed from starting to up
2019-10-04T02:04:56.675665+00:00 app[web.1]: ls: cannot access '/app/build/static/js/*.js': No such file or directory
2019-10-04T02:04:56.676135+00:00 app[web.1]: Error injecting runtime env: bundle not found '/app/build/static/js/*.js'. See: https://github.com/mars/create-react-app-buildpack/blob/master/README.md#user-content-custom-bundle-location
2019-10-04T02:04:56.890081+00:00 app[web.1]: Starting log redirection...
2019-10-04T02:04:56.890346+00:00 app[web.1]: Starting nginx...

如果您发现我的路径有任何问题/如果您对如何让 heroku 找到我的 bundle.js 文件有任何想法,请告诉我。

非常感谢

标签: reactjsherokuwebpack

解决方案


你可以修改你static.json的样子:

"routes": {
    "/**": "index.html",
    "*": "index.html"
}

推荐阅读