提问者:小点点

heroku中托管的React项目在打开时失败


因此,使用bitbucket管道向heroku部署了一个React项目,该项目运行良好,但现在似乎无法使heroku打开该项目时不使用我的Package.json中的脚本npm start。建议创建一个文件Procfile,它是一个txt文件,内部有have

Web:index.html

在我的WebPack中:

entry: {
    bundle: './src/index.js'
},
output: {
    publicPath : '/',
    path: path.resolve(__dirname,'build'),
    filename: '[name].[chunkhash].js'
},

和package.json中

 "scripts": {
    "heroku-prebuild": "npm install --only=dev",
    "clean": "rimraf build",
    "build": "npm run clean && webpack -p",
    "serve": "webpack-dev-server --progress --colors"
  },

在heroku日志中得到:

HEROKU[router]:at=error code=h10 desc=“App已崩溃”method=get path=“/”host=projectname.herokuapp.com request_id=a2bc33da-f938-4d7b-9395-b40442f9b2c0 fwd=“88.157.88.35”dyno=connect=service=status=503 bytes=protocol=https

HEROKU[router]:at=error code=h10 desc=“App已崩溃”method=get path=“/favicon.ico”host=projectname.herokuapp.com request_id=b2de2bdf-528e-4f97-9fe9-7f313e025ebd fwd=“88.157.88.35”dyno=connect=service=status=503 bytes=protocol=https

不使用create-react-app,如果可能,不想添加节点express以指向react项目https://blog.bitsrc.io/React-production-deployment-part-3-heroku-316319744885

那么我需要在procfile中指向build/index.html吗??或者是其他的方式,所有的例子都是关于create-react-app和node express....


共1个答案

匿名用户

我们能够在下面的博客中找到解决方案,如所述,如果Procfile丢失,heroku默认运行npm start命令,或者在Procfile中添加行web:npmstart,如博客中所述,package.json中的start命令运行serve-s build,其中serve是一个包,以指向bundle和index.html文件所在的构建文件夹,现在它已经很好地工作了。Heroku应该有一个默认选项指向默认文件夹。但所有尝试都失败了...所以感谢@Bernard Bado和他的博客指出了解决方案。