今天重新整理了一下Angular、React、Vue的部署方案，采用docker+nginx方式进行部署。
nginx.confDockerfiledocker-compose.yaml
编写配置文件
编写nginx.conf文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
default_type application/octet-stream;
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';
access_log /var/log/nginx/access.log main;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name _;
root /usr/share/nginx/html;
index index.html index.htm;
try_files $uri $uri/ /index.html;
}
}
|
编写Dockerfile文件
1
2
3
4
5
6
7
8
9
10
11
12
13
|
FROM node:12.10-alpine as build-app
COPY . /app
WORKDIR /app
RUN npm install && npm run build
FROM nginx:alpine
COPY nginx.conf /etc/nginx/nginx.conf
COPY --from=build-app /app/dist /usr/share/nginx/html
|
编写docker-compose.yaml文件
1
2
3
4
5
6
7
8
9
| version: '3'
services:
app:
build: .
image: app
container_name: app
ports:
- 8080:80
restart: always
|
启动服务
1
| $ docker-compose up -d --build
|