把 vue 项目打包成镜像推到 k8s 上

文件目录结构(vue 打包的文件扔进 dist 目录内)

编写 default.conf

server {
    listen 80;
    server_name  -;
    location / {
          root /home/dist;
          index  index.html index.htm;
          try_files  $uri $uri/ /index.html;
    }
	
 }

编写 Dockerfile

FROM nginx:1.21
RUN mkdir /home/dist
RUN rm -rf /etc/nginx/conf.d/default.conf
COPY ./default.conf /etc/nginx/conf.d/default.conf
COPY ./dist/ /home/dist

编写 YAML

apiVersion: apps/v1
kind: Deployment
metadata:
  name: ahu-admin
spec:
  replicas: 1
  selector:
    matchLabels:
      app: ahu-admin
  template:
    metadata:
      labels:
        app: ahu-admin
    spec:
      containers:
      - name: ahu-admin
        image: chishishuan/ahu_admin:v1.0.0
        ports:
        - containerPort: 80
---
apiVersion: v1
kind: Service
metadata:
  name: ahu-admin
spec:
  selector:
    app: ahu-admin
  ports:
    - protocol: TCP
      port: 80
      targetPort: 80
      nodePort: 32001
  type: NodePort

打包成镜像

docker image build -t chishishuan/ahu_admin:v1.0.0 .

打包到 k8s 环境

kubectl apply -f deploy.yaml

查看信息

kubectl get pod,service

使用 nginx 代理

server {
    listen 80;
    server_name  ahuadmin.dobell.com;
    location / {
	    proxy_pass http://127.0.0.1:32001;
    }
 }

查看效果

浏览器访问

http://ahuadmin.dobell.com