【问题标题】:Unable to run a development build of a React app in a Docker container using node:alpine无法使用 node:alpine 在 Docker 容器中运行 React 应用程序的开发版本
【发布时间】:2020-02-13 13:51:09
【问题描述】:

我有一个基于 Facebook 的 create-react-app 的 React 应用程序。在开发过程中,我在特定的本地端口(60001)上运行它。为此,我将 package.jsonscripts 部分中的默认 start 脚本更改为以下内容:

    "start": "set PORT=60001 && react-scripts start",

我现在需要在使用相同端口的 Docker 容器中运行它。在我的 Dockerfile 中,我有这两个阶段:

FROM node:alpine as build
COPY ./package.json /app/package.json
WORKDIR /app
RUN npm install
RUN rm -f .npmrc

FROM build as build-dev
COPY ./public/ /app/public
COPY ./src/ /app/src
EXPOSE 60001
CMD ["npm", "start"]

请注意,我正在公开我希望 npm 开发服务器绑定到的容器上的端口。

我按照你的期望构建了镜像,目标是上面的build-dev Docker 阶段。

docker build --target build-dev -t my-app:local

然后我像这样运行容器:

docker run -it -p 60001:60001 my-app:local

当我希望我的开发应用程序构建运行时,我的目的是将我的本地端口 60001 绑定到容器上的同一端口。

当我这样做时,我看到确认 npm 正在运行正确的脚本并且应用程序已编译。但是,浏览到http://localhost:60001/ 什么也没给我。只是一个ERR_CONNECTION_REFUSED,好像那里什么都没有。

我看不出我在这里做错了什么。有任何想法吗?我希望我能够从容器日志中获得一些见解,但是当我为此容器运行 docker logs 时,我只看到反应脚本输出确认我的应用程序已编译。

【问题讨论】:

    标签: node.js reactjs docker


    【解决方案1】:

    如果您使用的是 docker-compose,添加这一行为我解决了问题...

    线路是stdin_open: true

    这是我docker-compose.yml的一个基本示例:

    version: "3.7"
    
    services:
      test-app:
        stdin_open: true
        container_name: test-app
        build: .
        ports:
          - "3000:3000"
        volumes:
          - /app/node_modules
          - .:/app
    

    示例Dockerfile供参考:

    FROM node:alpine
    
    WORKDIR /app
    
    COPY package.json yarn.lock ./
    
    RUN yarn install
    
    COPY . .
    
    EXPOSE 3000
    
    CMD ["yarn", "start"]
    

    有关这方面的更多信息,我会查看create-react-app 的 github 问题

    GitHub Issue


    祝你好运!这让我发疯了好几个小时

    PS 不确定这在生产构建中如何保持

    【讨论】:

    • 我今天被困了好几个小时。谢谢你。
    • 在生产中你不应该“启动”,但你应该构建一个优化的生产版本并服务它。类似react-scripts build && npx serve build
    【解决方案2】:

    似乎应用与容器 localhost 绑定。​​

    尝试调试

    docker exec -it <container_id> ash
    #then
    curl localhost:60001
    

    它应该在本地主机上工作。

    要使其可以从容器外部访问,请执行以下操作。

    # i think its window syantax
    "start": "set PORT=60001 HOST=0.0.0.0 react-scripts start",
    

    "start": "PORT=60001 HOST=0.0.0.0 react-scripts start",
    

    主机:

    默认情况下,开发 Web 服务器绑定到所有主机名 设备(本地主机、LAN 网络地址等)。你可以用这个 变量来指定不同的主机。

    advanced-configurationHOST option react-app

    【讨论】:

    • 感谢您的回答。不幸的是我得到ash: curl: not found。我仍然尝试了您的建议"start": "set PORT=60001 HOST=0.0.0.0 react-scripts start",,它使容器崩溃,还有"start": "set PORT=60001 HOST=0.0.0.0 &amp;&amp; react-scripts start",,它声称正在运行开发服务器,但在本地主机上仍然没有站点。我还尝试在EXPOSE 行之前将ENV HOST=0.0.0.0 添加到我的Dockerfile 中,并使用原始的start 脚本,但仍然存在同样的问题。
    • Apk add - - no-cache curl amd try
    • 如果能提供 github repo 的链接,我可以试试
    • 干杯,有机会我会试试的。不幸的是,目前在私人回购中。如果有机会,我会尝试在某个地方进行演示......
    猜你喜欢
    • 2020-07-17
    • 1970-01-01
    • 2020-12-30
    • 1970-01-01
    • 1970-01-01
    • 2017-08-03
    • 1970-01-01
    • 1970-01-01
    • 2016-04-11
    相关资源
    最近更新 更多