Докеризация Vue в колбе с использованием uwsgi и nginx
Я бы хотел контейнеризировать клиент-серверный проект, над которым я работал. Структура проекта выглядит следующим образом:
├── client
│ ├── dist
│ ├── node_modules
│ ├── public
│ └── src
├── nginx
└── server
├── __pycache__
├── env
├── static
└── templates
Клиент-это приложение VueJs, а сервер-Flask.
Я знаю, что должен построить приложение Vue с помощью npm run build
и "каким-то образом" скопировать содержимое папки dist в каталоги статических и шаблонов сервера.
Кроме того, я хотел бы поставить сервер позади uwsgi и Nginx для производства.
Я следовал этому учебнику:
https://pythonise.com/series/learning-flask/building-a-flask-app-with-docker-compose
но это не касается того, как обслуживать статические файлы Vue (после того, как они были построены). Мне очень понравился подход использования docker-compose (как предлагалось в учебнике), поэтому я последовал ему, и теперь у меня есть docker-compose.yml в корневом каталоге и 2 Dockerfile (для клиента и сервера)
Докер-сочинитель.содержание yml-это:
version: "3.7"
services:
flask:
build: ./server
container_name: flask
restart: always
expose:
- 8080
nginx:
build: ./client
container_name: nginx
restart: always
ports:
- "80:80"
Файл настройки сервера:
# Use the Python3.7.2 image
FROM python:3.7.2-stretch
# Set the working directory to /app
WORKDIR /app
# Copy the current directory contents into the container at /app
ADD . /app
# Install the dependencies
RUN pip install -r requirements.txt
# run the command to start uWSGI
CMD ["uwsgi", "app.ini"]
апп.содержимое ini:
uwsgi]
wsgi-file = app.py
callable = app
socket = :8080
processes = 4
threads = 2
master = true
chmod-socket = 660
vacuum = true
die-on-term = true
клиентский Dockerfile:
FROM node:lts-alpine as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build
# production stage
FROM nginx:stable-alpine as production-stage
COPY --from=build-stage /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
Я подумал, что, возможно, использование общего объема между контейнерами-это возможное решение, но не был точно уверен, что это правильный путь.
Любая помощь будет Вам очень признательна.
Ответы - Докеризация Vue в колбе с использованием uwsgi и nginx / Dockerizing Vue in Flask using uwsgi and nginx

06.01.2020 11:28:50
Так как вы используете Vue.js я бы предположил, что вы разрабатываете одностраничное приложение, сервер которого (Flask) является сервером API.
Чтобы служить вю.JS приложение, использующее Nginx, вы должны изменить nginx.conf
вместо proxy pass to Flask, обслуживает статические файлы, которые являются /usr/share/nginx/html
:
server {
listen 80;
location / {
root /usr/share/nginx/html;
try_files $uri $uri/ /index.html;
}
}
Чтобы сделать вю.приложение js может получить доступ к серверу API, который вы можете передать через прокси для некоторого префиксного пути, такого как /api
to Flask:
server {
...
location /api/ {
include uwsgi_params;
uwsgi_pass flask:8080;
}
}