ReactJS Heroku 部署错误：无法加载资源：服务器响应状态为 404（未找到）

Question

我有一个 ReactJS 应用程序，我正试图在 heroku 上部署它。它在本地运行良好，但未正确部署！在页面上，我得到 Cannot GET /

应用链接：https://nameless-spire-06291.herokuapp.com/

控制台错误： 1、加载资源失败：服务器响应状态为404（未找到） 2. 拒绝加载图像'https://nameless-spire-06291.herokuapp.com/favicon.ico'，因为它违反了以下内容安全策略指令：“default-src 'none'”。请注意，'img-src' 没有显式设置，因此 'default-src' 用作备用。

1. 这是我在 github 中的应用程序结构 https://github.com/sollama/reactJS-portfolio

2. 这是我的 server.js 供参考：

   const express = require('express')
   const app = express()
   const path = require('path')
   const port = process.env.PORT || 3001
   
   app.use('/', express.static(path.join(__dirname, 'public')))
   
   app.listen(port, () => console.log("Listening on Port", port)) 
   

3. 包.json：

   "scripts": {
       "dev": "parcel src/index.html",
       "build": "parcel build src/index.html",
       "start": "node server.js" ,
       "heroku-postbuild":"npm run build"
   },
   

对这一切都超级陌生，所以我不知道下一步该往哪里看，如果有任何想法，我将不胜感激！

Answer 1

Parcel 的默认输出目录是dist，而不是public。这是您要传递给 express.static 中间件的目录，以便它在正确的目录中查找资源。

app.use('/', express.static(path.join(__dirname, 'dist')))