Как я могу запустить это докеризованное приложение в режиме разработки?

Question

Фронтант сделан с помощью приложения create-react-app, а бэкэнд Node.js с Firebase. Это моя структура папок:

my-app
├── docker-compose.yml
├── client
│   ├── Dockerfile
│   ├── package.json
├── server
│   ├── Dockerfile
│   ├── package.json

docker -compose.yml

version: "3.8"
services:
  client:
    container_name: client
    build: ./client
    ports:
      - "3000:3000"
    tty: true

  server:
    container_name: server
    build: ./server
    ports:
      - "5000:5000"

client / package. json

{
  "name": "react-ui",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "axios": "^0.19.2",
    "node-sass": "^4.14.1",
    "normalize.css": "^8.0.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-redux": "^7.2.1",
    "react-scripts": "^3.4.1",
    "redux": "^4.0.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": [
    ">0.2%",
    "not dead",
    "not ie <= 11",
    "not op_mini all"
  ],
  "proxy": "http://server:5000",
  "secure": false
}

клиент / файл Docker

FROM node:lts

WORKDIR /client

COPY package*.json /client/

RUN npm install

COPY . /client/

RUN npm run build

EXPOSE 3000

CMD [ "npm", "start" ]

сервер / пакет. json

{
  "name": "snake-react-node",
  "version": "3.0.0",
  "engines": {
    "node": "10.x"
  },
  "scripts": {
    "start": "node ./build/index.js",
    "build": "tsc",
    "dev": "nodemon ./src/index.ts"
  },
  "dependencies": {
    "@types/express": "^4.17.7",
    "cors": "^2.8.5",
    "dotenv": "^8.2.0",
    "express": "^4.17.1",
    "firebase-admin": "^9.0.0",
    "moment": "^2.27.0",
    "rimraf": "^3.0.2",
    "ts-node-dev": "^1.0.0-pre.56",
    "typescript": "^3.9.7"
  },
  "license": "MIT",
  "devDependencies": {
    "nodemon": "^2.0.4",
    "npm-run-all": "^4.1.5"
  }
}

server / Dockerfile

FROM node:lts

WORKDIR /server

COPY package*.json /server/

RUN npm install

COPY . /server/

RUN npm run build

EXPOSE 5000

CMD [ "npm", "start" ]

Когда я запускаю docker-compose up в каталоге root, создаются два изображения и два контейнера, по одному для каждого Dockerfile. Приложение работает безупречно, и создается производственная сборка, но я хотел бы иметь возможность использовать Docker и для разработки с живыми перезагрузками

Answer 1

Вы можете использовать привязку монтирования тома для перезагрузки в реальном времени. Создайте другой файл для разработки, например docker-compose-dev.yml, и добавьте раздел volumes:.

Каждый раз, когда код изменяется на хост-машине с использованием вашей любимой IDE, контейнер подбирает его и выполняет горячую перезагрузку.

Примечание: я не тестировал эту установку. Просто предлагаю то, что вы могли бы сделать.

# docker -compose-dev.yml

version: "3.8"
services:
  client:
    container_name: client
    build: ./client
    volumes:
      - ./frontend-src:/client/src
    ports:
      - "3000:3000"
    tty: true

  server:
    container_name: server
    build: ./server
    ports:
      - "5000:5000"

Answer 2

Поскольку ваш server контейнер публикует ports: out, вы можете изменить настройки прокси в вашем package.json файле, чтобы указать на это. В среде разработки, отличной от Docker, установите

"proxy": "http://localhost:5000"

, а затем вы можете npm run dev иметь совершенно обычный локальный сервер разработки с перезагрузкой в ​​реальном времени, нацеленный на вашу внутреннюю службу, работающую в Docker .

На самом деле нет никаких технических преимуществ в попытке имитировать локальную среду разработки внутри контейнера Docker, особенно для приложений на основе браузера. Типичная цепочка инструментов сборки на основе Webpack не имеет сложных собственных зависимостей, которые потребовали бы специальной настройки, а поскольку само приложение запускается в браузере, оно не может использовать преимущества сети Docker, а сам контейнер не предоставляет никаких среды выполнения приложения. Таким образом, единственная реальная разница между запуском сервера разработки на хосте и в контейнере заключается в том, какую версию Node использует сборка Webpack, и, надеюсь, это не имеет существенного значения для вашего приложения.