【Kubernetes系列】K8s下部署前端Vue应用

---

一、编写 Dockerfile 文件

vi Dockerfile

FROM node:10.19.0 as build-stage
WORKDIR /app
ENV NODE_ENV uat
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
COPY ./nginx.conf /etc/nginx/nginx.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

二、编写 nginx 配置文件

vi nginx.conf

#这个文件给docker用的
#user  nobody;
worker_processes  1;

#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       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  logs/access.log  main;

    sendfile        on;
    #tcp_nopush     on;

    #keepalive_timeout  0;
    keepalive_timeout  65;
    client_max_body_size 10m;
    gzip on;
    gzip_min_length  5k;
    gzip_buffers     4 16k;
    gzip_http_version 1.0;
    gzip_comp_level 4;
    gzip_types       text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
    gzip_vary on;

    server {
        listen       80;
        server_name  localhost;

        location / {
            root /usr/share/nginx/html;
            try_files $uri $uri/ /index.html $uri/ =404;
            index  index.html index.htm;
        }
    }
}

三、编写打包上传私有仓库 shell

vi docker-build.sh

#代码目录
code_path=$PWD
REGISTRY_PATH='192.168.1.48/shop-ui'
BUILD_VERSION=4.2.3.7

read -p "请输入仓库地址": REGISTRY_PATH

echo $REGISTRY_PATH

docker build -t $REGISTRY_PATH/manager-ui:$BUILD_VERSION ${code_path}/manager
docker push $REGISTRY_PATH/manager-ui:$BUILD_VERSION

四、编写 K8s yaml 文件

vi deploy-ui.yaml

apiVersion: v1
kind: Namespace
metadata:
  name: shop-ui

---
apiVersion: apps/v1
kind: Deployment
metadata:
  name: manager-ui
  namespace: shop-ui
spec:
  replicas: 1
  selector:
    matchLabels:
      app: manager-ui
  template:
    metadata:
      labels:
        app: manager-ui
    spec:
      containers:
      - name: manager-ui
        image: 192.168.1.48/shop-ui/manager-ui:4.2.3.7
        ports:
        - name: http
          containerPort: 80
---
apiVersion: v1
kind: Service
metadata:
  name: manager-ui-service
  namespace: shop-ui
spec:
  selector:
    app: manager-ui
  ports:
    - name: http
      protocol: TCP
      port: 80
      targetPort: 80
      nodePort: 10003
  type: NodePort

五、部署服务

kubectl apply -f deploy-ui.yaml