时间戳

首页 > 解决方案 > 使用没有内容的 Heroku 问题白页部署全栈 MERN 应用程序

node.js - 使用没有内容的 Heroku 问题白页部署全栈 MERN 应用程序

问题描述

在同一个项目中，我有 2 部分后端和前端。我在 heroku 中部署我的网站，但我有一个没有内容的白页。这是网站的链接https://websiteinspire.herokuapp.com/ 请任何帮助。package.js 部分客户端

 { "name": "inspire-training-center-app",
  "version": "1.0.0",
  "description": "Web Site Inspire Training Center",
  "keywords": [],
  "homepage": ".",
  "private": true,
  "proxy": "http://localhost:5000",
  "main": "src/index.js",
}

服务器.js

if (process.env.NODE_ENV === 'production') {           
app.use(express.static(path.join(__dirname, './client/build')));
  app.get('*', (req, res) => {
    res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
  });
}

package.js 服务器

 "scripts": {
        "build": "cd client && npm run build",
        "install-client": "cd client && npm install",
        "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm run install-client && npm run build",
        "start": "node server.js",
        "client": "cd client && npm start",
        "dev": "concurrently \"nodemon server.js\" \"npm run client\""
      },

我的日志：

     »   Warning: heroku update available from 7.53.0 to 7.56.0.
2021-07-05T14:10:33.071974+00:00 app[api]: Release v6 created by user maktabanour100@gmail.com
2021-07-05T14:10:33.071974+00:00 app[api]: Deploy 91245125 by user maktabanour100@gmail.com
2021-07-05T14:10:34.000000+00:00 app[api]: Build succeeded
2021-07-05T14:10:35.241895+00:00 heroku[web.1]: Restarting
2021-07-05T14:10:35.282908+00:00 heroku[web.1]: State changed from up to starting
2021-07-05T14:10:36.894188+00:00 heroku[web.1]: Stopping all processes with SIGTERM
2021-07-05T14:10:37.157140+00:00 heroku[web.1]: Process exited with status 143
2021-07-05T14:10:47.136868+00:00 heroku[web.1]: Starting process with command `node server.js`
2021-07-05T14:10:50.116461+00:00 app[web.1]: server is running on port 25624
2021-07-05T14:10:50.694685+00:00 heroku[web.1]: State changed from starting to up
2021-07-05T14:10:50.999920+00:00 app[web.1]: Database connection successful
2021-07-05T14:13:33.577551+00:00 heroku[router]: at=info method=GET path="/" host=websiteinspire.herokuapp.com request_id=7166d80e-eb68-41b5-9700-c6f882a44bcb fwd="102.30.90.13" dyno=web.1 connect=1ms service=19ms status=200 bytes=3927 protocol=https
2021-07-05T14:13:36.968299+00:00 heroku[router]: at=info method=GET path="/favicon.ico" host=websiteinspire.herokuapp.com request_id=83b4386b-5d8a-4cd3-b652-5e1d518b3bff fwd="102.30.90.13" dyno=web.1 connect=2ms service=22ms status=200 bytes=1951 protocol=https

标签： node.jsreactjsherokureact-fullstack

解决方案

确保在项目的根目录下有客户端/构建。然后试试这个

if (process.env.NODE_ENV === 'production') {     
 app.use((req, res, next) => {
    res.sendFile(path.join(__dirname, 'client', 'build', 'index.html'));
})     
}

推荐阅读