文章目录
- 使用阿里CICD流水线打包Vue项目到阿里的docker镜像私仓，并自动部署到服务器启动服务
- 1、功能实现原理大家可以看我之前的两篇文章
- 2、打包vue项目和打包咱们的Java项目过程差不多相同，大家可以看着上面的Java打包过程进行实验，下面是vue打包过程中几个特别的地方
- 2.1、流水线模板使用Node.js
- 3、然后就保存运行即可
- 4、部署过程可以看下面这篇文章
使用阿里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.confdefault.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、然后就保存运行即可
