同時運行 Express 和 Create-React-App 問題

Question

我已經使用 Express 和 Create-React-App ( http://myfirst-reactapp.herokuapp.com/ ) 構建了一個簡單的基礎應用程序。 我的項目分為兩部分：一個是服務器（它有一個 package.json 和一個 index.js 文件），另一個是客戶端（使用 npm create-react-app 創建）。

我試圖將用戶從服務器端重定向到客戶端（例如 localhost:5000/test 將重定向到 localhost:3000/test），但是在將其部署到Heroku 后，出現以下錯誤，並且找不到解決問題的答案：

未捕獲的語法錯誤：意外的標記 <

索引.js

const express = require('express');
const app = express();
const path = require('path');

if (process.env.NODE_ENV === 'production') {
    app.use(express.static('/client/build'));

    app.get('*', (req, res) => {
        res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
    });
}

const PORT = process.env.PORT || 5000;
app.listen(PORT);

package.json（服務器）

{
  "name": "heroku_base",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "engines": {
    "node": "6.11.2",
    "npm": "3.10.10"
  },
  "scripts": {
    "start": "node index.js",
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "express": "^4.16.2"
  }
}

Answer 1

您將每個請求的 index.html 文件返回到 express 服務器。

嘗試刪除此代碼

app.get('*', (req, res) => {
    res.sendFile(path.resolve(__dirname, 'client', 'build', 'index.html'));
});

另外，你可能應該更換

app.use(express.static('/client/build')); 

像這樣的東西

app.use(express.static(path.join(__dirname, 'client/build')));