Angular и Docker: невозможно получить доступ к приложению с хоста

Question

Я пытаюсь запустить приложение Angular через Docker для разработки. Я хочу, чтобы приложение выполняло перезагрузку в реальном времени в контейнере Docker каждый раз, когда в хост вносятся изменения - так же, как если бы я запускал на хост-компьютере команду «ng serve».

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

Вот мои настройки:

.env:

PROJECT_NAME=angular_proj
CMS_IMAGE=node:8.16.0-alpine

Dockerfile:

ARG CMS_IMAGE

FROM ${CMS_IMAGE} AS node

ARG PROJECT_NAME

RUN mkdir -p /srv/www/${PROJECT_NAME}/cms

WORKDIR /srv/www/${PROJECT_NAME}/cms

COPY /cms/package*.json ./

RUN npm install

COPY /cms ./

EXPOSE 4200/tcp

RUN npm start #executes 'ng serve --host 0.0.0.0'

докер-compose.yml:

version: '3.7'

services:

  cms:
    container_name: ${PROJECT_NAME}_cms
    build:
      context: .
      dockerfile: .docker/cms/Dockerfile
      args:
        CMS_IMAGE: ${CMS_IMAGE}
        PROJECT_NAME: ${PROJECT_NAME}
    ports:
      - 4200:4200
    volumes:
      - ./cms:/srv/www/${PROJECT_NAME}/cms

Когда я запускаю контейнер, все работает как положено:

** Angular Live Development Server прослушивает 0.0.0.0:4200, откройте ваш браузер на http://localhost:4200/ **

Но когда я пытаюсь открыть приложение с хоста, я получаю ERR_CONNECTION_REFUSED. Я искал похожие темы и пробовал большинство их решений, но безуспешно. Что я делаю не так?

Я использую MacOS Mojave с Docker 2.0.0.3 (31259).

Answer 1

С моими начальными настройками, несмотря на то, что Angular CLI не был установлен, приложение было создано и обслуживалось. Но сервер Angular вызвал остановку создания / запуска контейнера, поэтому я не смог получить к нему доступ.

Чтобы все работало как положено, я установил Angular CLI в контейнер и использовал его для запуска приложения:

Dockerfile:

ARG CMS_IMAGE

FROM ${CMS_IMAGE} AS node

ARG PROJECT_NAME

RUN mkdir -p /srv/www/${PROJECT_NAME}/cms

WORKDIR /srv/www/${PROJECT_NAME}/cms

COPY /cms/package*.json ./

RUN npm install

RUN npm install -g @angular/cli #added

COPY /cms ./

EXPOSE 4200/tcp

#RUN npm start #executes 'ng serve --host 0.0.0.0' #removed!
CMD ng serve --host 0.0.0.0 #added