Невозможно создать многоадресное приложение-докер (Angular-Node-MongoDB) с помощью одной команды npm

Question

Я пытаюсь создать многоконтейнерное приложение-докер Angular-Node-MongoDB с помощью одной команды npm.Вот демонстрационное приложение .

Контейнеры Node-MongoDB развернуты, но приложение Angular не развернуто в контейнере должным образом, так как команда docker не может скопировать артефакты сборки Angular (./App / UI / dist) для папки развертывания nginx контейнера Angular . / Usr / share / nginx / html (когда я присоединяю оболочку к контейнеру Angular и выполняю ~ ls, я вижу ./usr/share/nginxКаталог / html пуст. В идеале он должен содержать содержимое из App / UI / dist.)

Структура папки:

/ App / package.json:

  "scripts": {
    "start": "npm run build:watch:UI:dev && npm run compose:docker:dev",
    "build:watch:UI:dev": "cd UI && npm run ng build --watch",
    "compose:docker:dev": "docker-compose -f app.docker-compose.dev.yml up -d --build"
  }

Если я запускаю ~ / Documents / App $ npm start , все три контейнера развернутыно проект пользовательского интерфейса не работает, если есть содержимое внутри ./usr/share/nginx/html.Однако контейнеры Node и MongoDB работают нормально.

Если я по отдельности запускаю команду docker compose для проекта Angular из папки пользовательского интерфейса, то приложение контейнера Angular работает нормально.(Я вижу все артефакты сборки внутри ./usr/share/nginx/html)

~/Documents/POC/App/UI$ ng build --watch
~/Documents/POC/App/UI$ docker-compose -f docker-compose.dev.yml up -d --build

Я предполагаю, что проблема заключается в том, что содержимое App / UI / dist копируется в промежуточный контейнерно затем это содержимое не копируется в окончательно развернутый контейнер Angular.Это потому, что я запускаю команду npm из другой папки и, следовательно, вызывает некоторые проблемы с разрешениями?Или это проблема с volume / contex в файле создания Docker, поскольку команда теперь выполняется из корневой папки приложения вместо папки App / UI?

App/UI/.docker/dev.dockerfile:

FROM nginx:alpine
LABEL author="Saurabh Palatkar"
COPY nginx.conf /etc/nginx/nginx.conf    
COPY /dist /usr/share/nginx/html
RUN ls /usr/share/nginx/html
EXPOSE 80 443
CMD [ "nginx", "-g", "daemon off;" ]

App / UI / docker-compose.dev.yml:

version: '3.4'    
services:    
      angular-nginx-docker:
        container_name: ng-docker-dev
        image: ng-docker-dev
        build: 
          context: .
          dockerfile: .docker/dev.dockerfile
        environment:
          NODE_ENV: development
        volumes: 
          - "./dist:/usr/share/nginx/html"
        ports:
          - 4200:80
        ## set your startup file here
        command: [nginx-debug, '-g', 'daemon off;']

App / app.docker-compose.dev.yml:

version: "3.4"    
services:
  angular-nginx-docker:
    container_name: ng-docker-dev
    image: ng-docker-dev
    build: 
      context: UI
      dockerfile: .docker/dev.dockerfile
    environment:
      NODE_ENV: development
    volumes: 
      - "./dist:/usr/share/nginx/html"
    ports:
      - 4200:80
    ## set your startup file here
    command: [nginx-debug, '-g', 'daemon off;']
  api:
    container_name: node-api
    image: node-api
    build:
      context: API
      dockerfile: .docker/dev.dockerfile
    environment:
      PORT: 5000
      MONGO_URL: mongodb://database:27017
      NODE_ENV: dev
    ports:
      - "5000:5000"
    links:
      - database
    depends_on:
      - database

  database:
    container_name: database
    image: mongo:4.0.3
    ports:
      - "27017:27017"

Answer 1

Как я и догадался, это была проблема с путем в volumes внутри . / App / app.docker-compose.dev.yml file

Поэтому я изменил путь к томам с:

"./dist:/usr/share/nginx/html"

Кому:

"./UI/dist:/usr/share/nginx/html"

Answer 2

Ваши файлы докера находятся в UI/docker, и вы пытаетесь скопировать dist, как если бы он был в UI/docker/dist.

Попробуйте поместить файл dev.docker непосредственно в каталог UI и изменитестрока копирования до COPY dist /usr/share/nginx/html.