Heroku 部署：如何將我的應用程序指向應用程序/客戶端/構建？

Question

如何將我的應用程序指向應用程序/客戶端/構建？

將我的應用程序部署到 Heroku 時出現錯誤：“錯誤：ENOENT：沒有這樣的文件或目錄，stat '/app/server/build/index.html'”。我添加了我的 package.json、server.js 和我的應用程序結構。

應用程序 ->

->客戶端

-建造

-上市

-src

-組件

-App.js

-index.js

->服務器

-D b

-路線

-server.js

-package.json

-Procfile

• ETC....

它需要指向 app/client/build/index.html。

我不知道 heroku 從哪里獲取 app/server/build/index.html 中的 app/server 部分，我知道它從 server.js 中的以下代碼中獲取 build/index.html 部分：

'''

// server static in prod env
if(process.env.NODE_ENV === 'production') {
//   Set static folder
  app.use(express.static('build'));

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

''' 完整的 server.js 文件 '''

const express = require("express");
const app = express();
const path = require('path');
const cors = require("cors");
require("dotenv").config({ path: "config.env" });
const port = process.env.PORT || 5000;
app.use(cors());
app.use(express.json());
app.use(require("./routes/record"));
// get driver connection
const dbo = require("./db/conn");

// server static in prod env
if(process.env.NODE_ENV === 'production') {
//   Set static folder
  app.use(express.static('build'));

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

app.listen(port, () => {
  // perform a database connection when server starts
  dbo.connectToServer(function (err) {
    if (err) console.error(err);

  });
  console.log(`Server is running on port: ${port}`);
});

'''

我懷疑“應用程序/服務器/”部分可能來自 npm 構建應用程序的方式，但我只是懷疑。 package.json：

'''

    {
  "name": "server",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "cd server && node server.js",
    "heroku-post-build": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client",
    "server": "cd server && node server.js",
    "client": "npm start --prefix client",
    "dev": "concurrently \"npm run server\" \"npm run client\"",
    "test": "echo \"Error: no test specified\" && exit 1"
    },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "concurrently": "^7.0.0",
    "cors": "^2.8.5",
    "dotenv": "^14.2.0",
    "express": "^4.17.2",
    "mongodb": "^4.3.1"
  }
}

'''

如果我應該添加其他可能有助於解決此問題的文件，請告訴我。 順便說一句，這個社區很棒。 很高興我在這個平台上學到的一切。

Answer 1

我將客戶端/構建添加到 static 並解析語句，應用程序現在指向 heroku 上的構建文件夾：

'''

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

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

'''