Question

现在我正在开发一个React应用程序。对于部署，我想使用nginx作为Web服务器。我编写了一个包含两个服务的docker-compose文件（一个用于React应用程序，另一个用于nginx Web服务器）。通常，nginx服务仅需要react项目中的“ build”文件夹。

现在我的问题是，当React容器运行时，如何将“ build”文件夹从react容器复制到nginx容器目录。

请查看Dockerfile和yaml文件。

docker-compose.yaml

version: "3"
services:
  nginx-server:    
    image: nginx_server:dev
    container_name: nginx
    build:
      context: ./nginx
      dockerfile: Dockerfile
    restart: always   

    command: >
      sh -c "cp -R /build/ /var/www/html/"   // I want to do something like that


    volumes:
      - .:/react_app_server/nginx

    ports:
      - 80:80
    depends_on:
      - react-app
    networks:
      - server_network


  react-app:
    container_name: my_react_app
    build:
      context: .
      dockerfile: ./Dockerfile
    image: my_react_app:dev 
    tty: true
    volumes:
      - .:/react_app
    ports:
      - "1109:1109"
    networks:
      - frontend_network
    command: >
      bash -c "npm run-script build"

networks:
  frontend_network:
    driver: bridge
  server_network:
    driver: bridge


volumes:
  static-volume:

React应用程序的Dockerfile

FROM node:10.16.3
RUN mkdir /app
WORKDIR /app
COPY . /app
ENV PATH /app/node_modules/.bin:$PATH
RUN npm install --silent
RUN npm install react-scripts@3.0.1 -g --silent
RUN npm run-script build

Nginx的Dockerfile

FROM nginx:1.16.1-alpine
RUN rm /etc/nginx/conf.d/default.conf
COPY /prod.conf /etc/nginx/conf.d

项目目录

My_React_App
    build
    nginx
        Dockerfile
        prod.conf
    node_modules
    public
    src
    .dockerignore
    docker-compose.yaml
    Dockerfile
    package-lock.json
    package.json
    README.md

Answer 1

您实际上并不需要复制数据，而是应该使用相同的卷。

您需要在两个容器之间共享一个named volume。

您的docker-compose.yaml应该是：

version: "3"
services:
  nginx-server:    
    image: nginx_server:dev
    container_name: nginx
    |
    |
    volumes:
      - .:/react_app_server/nginx
      - app-volume:/var/www/html/
    |
    |
  react-app:
    container_name: my_react_app
    build:
      context: .
    |
    |
    volumes:
      - .:/react_app
      - app-volume:/path/to/build/folder/
    |
    |

注意： 这里的app-volume是一个命名卷，我们将其安装在react-app容器内的目录中，预期构建文件夹将在该目录中被创建。同样的app-volume命名卷也安装在您要复制构建文件夹的/var/www/html/的nginx容器内。

此外，除了命名卷，您还可以在两个容器中安装相同的主机目录并共享数据。 -v /samepath/on/host:/path/to/build/folder和-v /samepath/on/host:/var/www/html。

希望这会有所帮助。

如何通过docker-compose.yml将一些数据从一个容器复制到另一个容器

1 个答案: