Vue打包成镜像

编写Dockerfile

FROM nginx:1.23

WORKDIR /home

ADD  nginx.conf /etc/nginx/nginx.conf
ADD  dist/ /usr/share/nginx/html/

EXPOSE 80

CMD nginx -g 'daemon off;'

编写nginx.conf

user  nginx;
worker_processes  1;

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;

    rewrite_log on;

    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;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #隐藏版本号
    server_tokens off;

    server {
        listen       80;
        server_name  localhost;

        # uding gzip
        gzip on;
        gzip_vary on;
        gzip_disable "MSIE [1-6]\.";
        gzip_min_length 1k;

			 resolver 8.8.8.8 valid=60s;
			 resolver_timeout 3s;

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


				# location ~ .*\.(?:htm|html)$
				# {
				#     add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate";
				# }

    }
}

由于我是通过域名后缀转发（例 ：http://xxxx.xxx.com/ui），需要修改vue.config.js中publicPath

还需要修改路由转发规则

export default new Router({
  base: "/ui",
  mode: 'history', // 去掉url中的#
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

外部nginx增加规则

      location ^~ /ui/ { 
      		# 移除前缀并内部重写
			proxy_pass http://ui-admin-web/;
	 }

Jenkins配置

我这里由于服务器性能不足，所以直接本地build提交。只要推送到私有仓库即可