Kubernetes下完成Vue项目的部署

上一篇曾介绍过Vue在History 模式存在404刷新问题，故而需采用不同的方式部署，而最采用的当属Nginx了，由于目前微服务的广泛应用， Vue也将是架构师需要了解部署的一个必要内容，关于kubernetes容器化编排工具不在本文范畴，不再展示叙述。

下面就介绍Vue项目的dockerfile文件的编写内容如下：

# STEP 1: Build
FROM node:10.16

LABEL authors="xxxxx<office@xxxxx.com>"

COPY package.json package-lock.json ./

RUN npm set progress=false && npm config set depth 0 && npm cache clean --force

RUN npm i && mkdir /app

WORKDIR /app

COPY . .

RUN npm install && npm run build

# STEP 2: Setup
FROM nginx:1.17

# 在k8s环境下，将conf文件以configmap形式进行映射，测试docker环境下需要放开
#COPY --from=0 /app/_nginx/nginx.conf /etc/nginx/nginx.conf

#COPY --from=0 /app/_nginx/* /etc/nginx/

COPY --from=0 /app/dist /etc/nginx/html

CMD [ "nginx", "-g", "daemon off;"]

完成上述dockerfile的编写之后就可以通过jenkins完成打包工作，本文重点讲解Vue项目的部署，故而关于Jenkins也不在此展示叙述，可自行百度。

接下来我们就开始编写Vue-ui项目的k8s脚本：

ConfigMap文件内容如下：

kind: ConfigMap
apiVersion: v1
metadata:
  namespace: self-namespace
  name: vue-ui-configmap-fat
data:
  nginx.conf: |+
    # 启动多worker进程
    worker_processes  auto;
    events {
      worker_connec