使用阿里CICD流水线打包Vue项目到阿里的docker镜像私仓,并自动部署到服务器启动服务

文章目录

使用阿里CICD流水线打包Vue项目到阿里的docker镜像私仓,并自动部署到服务器启动服务

1、功能实现原理大家可以看我之前的两篇文章

SpringBoot+Vue前后端分离项目在Linux系统中基于Docker打包发布,并上传镜像到阿里镜像私仓
使用阿里CICD流水线打包Java项目到阿里的docker镜像私仓,并自动部署到服务器启动服务

2、打包vue项目和打包咱们的Java项目过程差不多相同,大家可以看着上面的Java打包过程进行实验,下面是vue打包过程中几个特别的地方

2.1、流水线模板使用Node.js

2.2、编辑Node.js构建

2.3、在添加的镜像构建并推送至阿里云镜像仓库个人版中进行编辑


2.4、在vue项目下和src同级创建Dockerfile文件和default.conf文件

Dockerfile

java 复制代码
FROM nginx
COPY dist /usr/share/nginx/html
RUN rm -f /etc/nginx/conf.d/default.conf
#ADD default.conf /etc/nginx/conf.d/default.conf
COPY  default.conf /etc/nginx/conf.d/default.conf

default.conf

java 复制代码
upstream wms-app {
    server 192.168.11.87:3999 ;
}
server {
    listen       80;
    server_name  localhost;

    #access_log  /var/log/nginx/host.access.log  main;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html; #解决单页面找不到路径问题 404
    }

    location /api {
            proxy_pass http://wms-app;  #可以配置多个下游服务,具有负载功能
    }

    #error_page  404              /404.html;

    # redirect server error pages to the static page /50x.html
    #
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
    #
    #location ~ \.php$ {
    #    proxy_pass   http://127.0.0.1;
    #}

    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    #
    #location ~ \.php$ {
    #    root           html;
    #    fastcgi_pass   127.0.0.1:9000;
    #    fastcgi_index  index.php;
    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
    #    include        fastcgi_params;
    #}

    # deny access to .htaccess files, if Apache's document root
    # concurs with nginx's one
    #
    #location ~ /\.ht {
    #    deny  all;
    #}
}

3、然后就保存运行即可

4、部署过程可以看下面这篇文章

阿里CICD流水线Docker部署,将阿里镜像私仓中的镜像部署到服务器中

相关推荐
不掰手腕13 分钟前
在UnionTech OS Server 20 (统信UOS服务器版) 上离线安装PostgreSQL (pgsql) 数据库
linux·数据库·postgresql
感哥16 分钟前
Docker网络
docker
Lynnxiaowen41 分钟前
今天继续昨天的正则表达式进行学习
linux·运维·学习·正则表达式·云计算·bash
努力学习的小廉1 小时前
深入了解linux系统—— POSIX信号量
linux·运维·服务器
前端与小赵1 小时前
vue3和vue2生命周期的区别
前端·javascript·vue.js
刘一说1 小时前
CentOS部署ELK Stack完整指南
linux·elk·centos
从零开始的ops生活1 小时前
【Day 50 】Linux-nginx反向代理与负载均衡
linux·nginx
Sailing1 小时前
👉 👉 Vue3 自定义 Hook:从入门到进阶(~~安静的阅读2分钟,相信我,这篇文章一定能给你启发)
前端·javascript·vue.js
IT成长日记1 小时前
【Linux基础】Linux系统配置IP详解:从入门到精通
linux·运维·tcp/ip·ip地址配置