0_0 длинный вопрос:)
Судя по вашему описанию и предоставленным Dockerfile, вы столкнулись с ошибками на этапе сборки Docker-контейнера для фронтенда. Давайте разберем основные моменты и попробуем понять, в чем может быть проблема.
▎Ошибки в Dockerfile для фронта
1. Ошибка в COPY:
В вашем Dockerfile для фронтенда есть строки:
COPY --from=build /build /usr/share/nginx/html
COPY --from=build nginx.conf /etc/nginx/conf.d/default.conf
Проблема в том, что вы пытаетесь скопировать из несуществующего контекста. Ваша сборка фронтенда начинается с FROM node:alpine as build, и вы должны указать правильный путь к артефактам сборки.
Попробуйте изменить строку COPY --from=build /build /usr/share/nginx/html на:
COPY --from=build /frontend/build /usr/share/nginx/html
Это предполагает, что после выполнения команды npm run build в папке /frontend/build будет находиться ваша собранная версия приложения.
2. nginx.conf:
Убедитесь, что файл nginx.conf находится в правильной директории, откуда вы выполняете сборку. Если он не находится в контексте сборки, то Docker не сможет его скопировать.
▎Полный пример Dockerfile для фронта
Вот как может выглядеть ваш Dockerfile для фронта с учетом вышеуказанных изменений:
# Этап сборки
FROM node:alpine as build
WORKDIR /frontend
COPY package.json package-lock.json ./
RUN npm install
COPY . .
RUN npm run build
# Этап запуска
FROM nginx:stable-alpine
COPY --from=build /frontend/build /usr/share/nginx/html
COPY ./nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
▎Обновление docker-compose.yaml
В вашем docker-compose.yaml также убедитесь, что вы правильно связываете порты и используете правильные пути:
version: '3.8'
networks:
dev:
services:
nginx:
build:
context: .
dockerfile: nginx.Dockerfile # если у вас отдельный Dockerfile для nginx
ports:
- "80:80"
volumes:
- './nginx.conf:/etc/nginx/nginx.conf'
depends_on:
- backend
- frontend
networks:
- dev
backend:
build:
context: ./backend
networks:
- dev
frontend:
build:
context: ./frontend
networks:
- dev
▎Проверка 502 ошибки
Ошибка 502 Bad Gateway обычно означает, что Nginx не может связаться с вашим бэкендом или фронтендом. Убедитесь, что:
1. Бэкенд действительно запущен и доступен на порту 8000.
2. Фронтенд действительно запущен и доступен на порту 3000.
3. Проверьте логи Nginx и логи ваших приложений для получения более подробной информации о том, что может быть не так.
▎Запуск проекта
После всех изменений попробуйте заново собрать и запустить проект:
docker-compose up --build
Если возникнут дополнительные ошибки, пожалуйста, предоставьте их текст для дальнейшего анализа.