首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >反应应用程序没有加载与码头-撰写

反应应用程序没有加载与码头-撰写
EN

Stack Overflow用户
提问于 2021-02-15 17:29:15
回答 1查看 1.4K关注 0票数 0

我的React客户端的Dockerfile:

代码语言:javascript
运行
复制
FROM node:10

WORKDIR /app/client

COPY ["package.json", "package-lock.json", "./"]

RUN npm install --production

COPY . .

EXPOSE 3000

CMD ["npm", "start"]

我的快捷后端的Dockerfile:

代码语言:javascript
运行
复制
FROM node:10

WORKDIR /app/server

COPY ["package.json", "package-lock.json", "./"]
RUN ls
RUN npm install --production

COPY . .

EXPOSE 5000

CMD ["node", "server.js"]

在我的项目根目录中我的docker-compose.yml文件:

代码语言:javascript
运行
复制
version: '3'

services:
  backend:
    build:
      context: ./backend
      dockerfile: ./Dockerfile
    image: "isaacasante/mcm-backend"
    ports:
      - "5000:5000"
  frontend:
    build:
      context: ./client
      dockerfile: ./Dockerfile
    image: "isaacasante/mcm-client"
    ports:
      - "3000:3000"
    links:
      - "backend"

后端文件夹下的server.js文件:

代码语言:javascript
运行
复制
var express = require("express");
var cors = require("cors");
var app = express();
var path = require("path");

// Enable CORS and handle JSON requests
app.use(cors());
app.use(express.json());

app.post("/", function (req, res, next) {
  // console.log(req.body);
  res.json({ msg: "This is CORS-enabled for all origins!" });
});

// Set router for email notifications
const mailRouter = require("./routers/mail");
const readerRouter = require("./routers/reader");
const notificationsRouter = require("./routers/booking-notifications");
app.use("/email", mailRouter);
app.use("/reader", readerRouter);
app.use("/notifications", notificationsRouter);

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

app.listen(5000, function () {
  console.log("server starting...");
});

当我跑步时:

代码语言:javascript
运行
复制
docker-compose up

我在我的终端中得到以下输出:

代码语言:javascript
运行
复制
$ docker-compose up
Starting mcm_fyp_backend_1 ... done
Starting mcm_fyp_frontend_1 ... done
Attaching to mcm_fyp_backend_1, mcm_fyp_frontend_1
backend_1   | server starting...
frontend_1  |
frontend_1  | > mcm-app@0.1.0 start /app/client
frontend_1  | > react-scripts start
frontend_1  |
frontend_1  | ? ?wds?: Project is running at http://172.18.0.3/
frontend_1  | ? ?wds?: webpack output is served from
frontend_1  | ? ?wds?: Content not from webpack is served from /app/client/public
frontend_1  | ? ?wds?: 404s will fallback to /
frontend_1  | Starting the development server...
frontend_1  |
mcm_fyp_frontend_1 exited with code 0

我的后端退出代码0,我无法加载我的应用程序。不过,我的后端正在运行。

我做错了什么,我怎样才能让我的React Express-Node应用程序与Docker撰写一起运行?

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2021-02-15 19:03:31

我找到了防止我的前端服务从0退出的解决方案。我必须在我的docker-compose.yml文件中为它添加tty: true。此外,为了使前端-后端交互按照应用程序的预期工作,我必须将客户端的package.json中的代理命令更改为:

代码语言:javascript
运行
复制
"proxy": "http://backend:5000"

我将docker-compose.yml中的links命令更改为:

代码语言:javascript
运行
复制
links:
  - "backend:be"

重建后,一切都如愿以偿。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/66212658

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档