Как создать и развернуть ReactJ с помощью docker-compose

Question

Я пытаюсь сделать так, чтобы каждый раз, когда в приложение вносились новые изменения, мне не нужно создавать приложение, а затем запускать файл docker-compose.То, что я пытаюсь сделать, это то, что когда я изменяю код в моем приложении (ReactJs), чтобы просто запустить и запустить файл docker-compose, тогда docker-compose соберет и запустит его, используя nginx.

Вот чтоmy docker-compose.yml выглядит следующим образом:

version: '2'

services:
  nginx:
    image: 'bitnami/nginx:1.14.2'
    ports:
      - '80:8080'
    volumes:
      - ./build:/var/www/my-app
      - ./nginx.conf:/opt/bitnami/nginx/conf/nginx.conf:ro

Прямо сейчас с этим кодом мне нужно собрать приложение самостоятельно, запустив npm run build, а затем запустить и запустить файл docker-compose, чтобы он принял изменения.

Я точно не знаю, как это сделать, поэтому я предполагаю, что мне нужно создать Dockerfile run npm run build и затем вызвать bitmani / nginx: 1.14.2 на основе их документов: https://hub.docker.com/r/bitnami/nginx/

FROM node:8.7.0-alpine

RUN npm install

RUN npm run build

docker run --name nginx \
  -v /path/to/my_vhost.conf:/opt/bitnami/nginx/conf/vhosts/my_vhost.conf:ro \
  -v /path/to/nginx-persistence/nginx/conf/bitnami/certs:/bitnami/nginx/conf/bitnami/certs \
  bitnami/nginx:latest

и в docker-compose.yml звоните build . вместо image: bitnami/nginx.

Answer 1

Вы должны использовать для этого этап сборки.Ваш Dockerfile должен выглядеть следующим образом:

# Stage 1 - Building image
FROM node:8.7.0-alpine as node

WORKDIR /usr/src/app

COPY package*.json ./

RUN npm install

COPY . .

RUN npm run build

# Stage 2 - Running image
FROM bitnami/nginx:1.14.2

COPY --from=node /usr/src/app/build /var/www/my-app
COPY ./nginx.conf /opt/bitnami/nginx/conf/nginx.conf

А ваш docker-compose:

version: '3.3'

services:
  myApp:
    image: myapp:1.0
    container_name: my-app
    build: .
    ports:
      - 80:8080

Я адаптировал это из одного из моих проектов, так что если у вас возникнут какие-либо проблемы, дайте мне знать, и япроверим их.

Надеюсь, это поможет.