问题描述
我有一个功能齐全的全栈应用程序通过docker-compose运行。奇迹般有效。唯一的问题是团队必须重建整个应用程序以反映更改。这意味着使用docker-compose down
将整个过程推倒。
我正在寻找更新以下文件的帮助,以允许热重载或仅启用浏览器刷新以更改用户界面
注意:
任何帮助将不胜感激:)
package.json
{
"name": "politicore","version": "1.0.1","description": "Redacted","repository": "Redacted","author": "Redacted","license": "LicenseRef-LICENSE.MD","private": true,"engines": {
"node": "10.16.3","yarn": "YARN NO LONGER USED - use npm instead."
},"scripts": {
"dev": "docker-compose up","dev-force": "docker-compose up --build --force-recreate","dev-force-d": "docker-compose up --build --force-recreate -d","prod-up": "docker-compose -f docker-compose-prod.yml up","prod-up-force": "docker-compose -f docker-compose-prod.yml up --build --force-recreate","prod-up-force-d": "docker-compose -f docker-compose-prod.yml up --build --force-recreate -d","dev-down": "docker-compose down","dev-down-remove": "docker-compose down --remove-orphans","prod-down": "docker-compose down","prod-down-remove": "docker-compose down --remove-orphans"
}
}
server {
listen 80;
listen 443;
server_name MyUrl.com www.MyUrl.com;
server_tokens off;
proxy_hide_header X-Powered-By;
proxy_hide_header Server;
add_header X-XSS-Protection "1; mode=block";
add_header Strict-Transport-Security 'max-age=31536000; includeSubDomains; preload';
add_header x-frame-options DENY;
add_header X-Content-Type-Options nosniff;
add_header X-Permitted-Cross-Domain-Policies master-only;
add_header Referrer-Policy same-origin;
add_header Expect-CT 'max-age=60';
add_header Feature-Policy "accelerometer none; ambient-light-sensor none; battery none; camera none; gyroscope none;";
location / {
root /usr/share/Nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
location /graphql {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Host $server_name;
proxy_pass http://api:5000;
proxy_redirect default;
}
}
docker-compose开发文件
version: '3.6'
services:
api:
build:
context: ./services/api
dockerfile: Dockerfile-dev
restart: always
volumes:
- './services/api:/usr/src/app'
- '/usr/src/app/node_modules'
environment:
- NODE_ENV=development
- CHOKIDAR_USEPOLLING=true
env_file:
- common/.env
client:
build:
context: ./services/client
dockerfile: Dockerfile-dev
restart: always
volumes:
- './services/client:/usr/src/app'
- '/usr/src/app/node_modules'
ports:
- 80:80
environment:
- NODE_ENV=development
- CHOKIDAR_USEPOLLING=true
depends_on:
- api
stdin_open: true
客户服务dockerfile
FROM node:10 as builder
workdir /usr/src/app
copY package.json /usr/src/app/package.json
RUN npm install
copY . .
RUN npm run build
FROM Nginx:alpine
copY --from=builder /usr/src/app/build /usr/share/Nginx/html
copY Nginx/dev.conf /etc/Nginx/conf.d/default.conf
EXPOSE 80
CMD ["Nginx","-g","daemon off;"]
API dockerfile(开发和生产)
FROM node:10
workdir /usr/src/app
copY package.json /usr/src/app/package.json
RUN npm install
CMD ["npm","start"]
解决方法
据我了解,您的nginx文件定义了两个服务区域:location /
和location /graphql
。
第一个(location /
)从容器内的/usr/share/nginx/html
提供静态文件。这些文件是在docker构建期间创建的。由于这些是在多阶段docker构建中产生的,因此您需要更改策略。这里有一些选项可能会帮助您。
选项1
一种选择是在本地构建并挂载卷。
- 在您的机器上执行
npm run build
(甚至在* .js文件发生更改时,即使有文件监视者也可以执行构建 - 将
- ./build:/usr/share/nginx/html
添加到client
服务的卷列表中
这里的权衡是,您必须放弃完全使用docker化的版本(如果这对您和您的团队而言很重要)。
选项2
使用热重载节点服务器进行本地开发,并为生产环境构建docker映像。很难从文件中判断出客户端是否是反应,有角度的,vuejs等,但是通常它们具有运行本地开发服务器的模式。
这里要权衡的是,本地运行与生产运行不同。
选项3
将nginx和nodejs合并为一个Docker映像,并在其中进行热重载。
- 构建一个包含nodejs和nginx的本地docker镜像
- (您已经将卷装载到应用程序src文件的
client
中) - 设置映像,以便每次文件在该装入的卷中更改时在容器内部运行
npm run build
这里的权衡是,您可能在docker容器中运行多个进程(一个很大的禁忌)。
选项4
选项3的一种变体,您可以在其中运行2个Docker容器。
- 声明顶级卷
client_build
-
volumes: - client_build:
-
- 在
docker-compose
中创建2个卷的docker服务-
- ./services/client:/usr/src/app
-
- client_build:/usr/src/app/build
-
- 将构建卷添加到您的
client
服务中:- client_build:/usr/share/nginx/html
- 确保该目录更改时nginx会重新加载