SpringBoot+Vue前后端分离项目在Linux系统中基于Docker打包发布,并上传镜像到阿里镜像私仓

文章目录

  • SpringBoot+Vue前后端分离项目在Linux系统中基于Docker打包发布,并上传镜像到阿里镜像私仓
  • 一、Java项目基于Docker打包发布
    • 1.打包应用,将打好的jar包放到我们的linux系统中
    • 2.新建dockerfile
    • 3.打包镜像
    • 4.测试运行
    • 5.上传镜像到阿里云免费私仓
  • 二、Vue项目打包到docker镜像
    • 1.编译打包前端项目将打包生成的dist文件夹复制到咱们的wms-web文件夹内
    • 2 前端项目 nginx的配置文件default.conf 和 dockerfile
    • 3.构建镜像(同后端)
    • 4.运行测试

SpringBoot+Vue前后端分离项目在Linux系统中基于Docker打包发布,并上传镜像到阿里镜像私仓

一、Java项目基于Docker打包发布

1.打包应用,将打好的jar包放到我们的linux系统中

在这里插入图片描述

//跳过测试类,更快打包。也可以直接双击侧边栏maven里面的package打包
mvn clean package -DskipTests

在这里插入图片描述
将打好的jar包放到咱们opt目录下的自定义文件夹内
在这里插入图片描述

2.新建dockerfile

FROM  openjdk:8
#设置工作目录
WORKDIR  /opt
#COPY  wms-app-1.0-SNAPSHOT.jar /workspace/app.jar
ADD  wms-app-1.0-SNAPSHOT.jar app.jar
#配置容器暴漏的端口
EXPOSE 8080
#查看是否已经copy进去
RUN  ls 
#java App
ENTRYPOINT  ["java","-jar","app.jar"]

在这里插入图片描述

3.打包镜像

docker build -t wmsapp:v1 .
//最后有一个点不要忘了

在这里插入图片描述
打包成功后
在这里插入图片描述

4.测试运行

–rm 代表退出之后,容器移动删除

//指定在Linux宿主机3999端口运行,这样可以在电脑主机浏览器进行访问
docker run -d -p 3999:8080 wmsapp:v1

可以看到成功启动了服务
在这里插入图片描述

5.上传镜像到阿里云免费私仓

阿里云免费私仓
创建好自己的镜像仓库后会显示操作指南
在这里插入图片描述

身份登录

$ docker login --username=fpl1116 registry.cn-beijing.aliyuncs.com

在这里插入图片描述
将镜像推送到Registry

$ docker tag [ImageId] registry.cn-beijing.aliyuncs.com/fpl-erp/wms-project:[镜像版本号]
$ docker push registry.cn-beijing.aliyuncs.com/fpl-erp/wms-project:[镜像版本号]

在这里插入图片描述

可以在镜像仓库中进行查看
在这里插入图片描述

拉取镜像

$ docker pull registry.cn-beijing.aliyuncs.com/fpl-erp/wms-project:[镜像版本号]

二、Vue项目打包到docker镜像

1.编译打包前端项目将打包生成的dist文件夹复制到咱们的wms-web文件夹内

npm run build

在这里插入图片描述

2 前端项目 nginx的配置文件default.conf 和 dockerfile

default.conf

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;#}
}

1.root:设置静态根目录为 /usr/share/nginx/html
2. index:设置目录的默认文件为 index.html 、index.htm、index.php
3. try_files:设置文件查找规则为 $uri $uri/ /index.html。即3个规则,先从 $uri 查找,再从 u r i / 目录中查找,最后查找 / i n d e x . h t m l 。

dockerfile

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

在这里插入图片描述

3.构建镜像(同后端)

docker build -t wmsweb:v1 .

在这里插入图片描述

4.运行测试

docker  run -d -p 3888:80  wmsweb:v1

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/771090.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Webpack生成企业站静态页面 - 项目搭建

现在Web前端流行的三大框架有Angular、React、Vue,很多项目经过这几年的洗礼,已经都 转型使用这三大框架进行开发,那为什么还要写纯静态页面呢?比如Vue中除了SPA单页面开发,也可以使用nuxt.js实现SSR服务端渲染&#x…

基于前端技术实现的全面预算编制系统

前言 在现代商业环境中,预测销售数据和实际成本是每个公司CEO和领导都极为重视的关键指标。然而,由于市场的不断变化,准确地预测和管理这些数据变得愈发具有挑战性。为了应对这一挑战,建立一个高效的系统来管理和审查销售数据的重…

hbase启动错误-local host is“master:XXXX“ destination is:master

博主的安装前提: zookeeper安装完成,且启动成功 hdfs高可用安装,yarn高可用安装,且启动成功 报错原因:端口配置不对 解决方案: 输入:hdfs getconf -confKey fs.default.name 然后把相应的…

考研数学一——概率论真题——自我总结题型整理(总分393)

系列文章目录 终于考完研了,本人考的是南京航空航天大学的仪器科学与技术,英一数一电路,以下是成绩单: 平时习惯整理自己的学习体系,以下是一个记录。 其实,每个人都应该训练,看到某一类题目…

2024/03/25(C++·day1)

一、思维导图 二、练习 练习一 定义自己的命名空间&#xff0c;其中有string类型的变量&#xff0c;再定义两个函数&#xff0c;一个函数完成字符串的输入&#xff0c;一个函数完成求字符串长度&#xff0c;再定义一个全局函数完成对该字符串的反转 #include <iostream&g…

# vue刷新当前页面

vue刷新当前页面 背景 在项目开发中遇到了需要刷新当前页面的场景。中途尝试了以下四种方法 1、this. f o r c e U p d a t e ( ) t h i s . forceUpdate() this. forceUpdate()this.forceUpdate() 是Vue.js中的一个方法&#xff0c;用于强制组件重新渲染&#xff0c;即使没有…

景联文科技上新高质量大模型训练数据!

在过去的一年中&#xff0c;人工智能领域呈现出了风起云涌的态势&#xff0c;其中模型架构、训练数据、多模态技术、超长上下文处理以及智能体发展等方面均取得了突飞猛进的发展。 在3月24日举办的2024全球开发者先锋大会的大模型前沿论坛上&#xff0c;上海人工智能实验室的领…

【Android】美团组件化路由框架WMRouter源码解析

前言 Android无论App开发还是SDK开发&#xff0c;都绕不开组件化&#xff0c;组件化要解决的最大的问题就是组件之间的通信&#xff0c;即路由框架。国内使用最多的两个路由框架一个是阿里的ARouter&#xff0c;另一个是美团的WMRouter。这两个路由框架功能都很强大&#xff0…

一篇文章,告别Flutter状态管理争论,问题和解决

起因 每隔一段时间&#xff0c;都会出现一个新的状态管理框架&#xff0c;最近在YouTube上也发现了有人在推signals, 一个起源于React的状态管理框架&#xff0c;人们总是乐此不疲的发明各种好用或者为了解决特定问题而产生的方案&#xff0c;比如Bloc, 工具会推陈出新&#x…

[Vue warn]: Invalid vnode type when creating vnode: false

如题&#xff0c;意思是创建vnode时&#xff0c;vnode类型无效:false。 根据右边的索引点进去&#xff0c;发现定位的是组件loading。搜索loading发现声明了变量loading&#xff0c;更改后问题消失。

【python】获取4K壁纸保存到本地文件夹【附源码】

图片信息丰富多彩&#xff0c;许多网站上都有大量精美的图片资源。有时候我们可能需要批量下载这些图片&#xff0c;而手动一个个下载显然效率太低。因此&#xff0c;编写一个简单的网站图片爬取程序可以帮助我们高效地获取所需的图片资源。 目标网站&#xff1a; 如果出现模…

物联网云组态是什么?部署物联网云组态有什么作用?

在信息化与工业化的深度融合进程中&#xff0c;物联网云组态以其独特的优势&#xff0c;正在成为企业数字化转型的重要工具。那么&#xff0c;物联网云组态究竟是什么呢&#xff1f;部署物联网云组态又能给企业带来哪些实质性的好处呢&#xff1f;今天&#xff0c;我们将围绕这…

vue 消息左右滚动(前后无缝衔接)

之前一直用vue-seamless-scroll&#xff0c;无奈此组件有两个缺点不满足实际效果&#xff1a;1&#xff09;标题过长被截取、2&#xff09;标题果断也会滚动&#xff0c;无奈我自己封装一个&#xff0c;满足此两个弊端&#xff0c;也能达到vue-seamless-scroll组件的功能&#…

AI:Nvidia官网人工智能大模型工具合集(文本生成/图像生成/视频生成)的简介、使用方法、案例应用之详细攻略

AI&#xff1a;Nvidia官网人工智能大模型工具合集(文本生成/图像生成/视频生成)的简介、使用方法、案例应用之详细攻略 目录 Nvidia官网人工智能大模型工具合集的简介 1、网站主要功能包括: Nvidia官网人工智能大模型工具合集的使用方法 1、SDXL-Turbo的使用 2、GEMMA-7B的…

详解 net user

net user 是 Windows 操作系统自带的一个命令行工具&#xff0c;用于管理和查询本地用户账户信息。在域环境中&#xff0c;它可以用于管理本地用户账户&#xff0c;但对域用户账户的操作能力有限&#xff0c;尤其是查看域账户锁定状态等功能。以下是 net user 命令的详解&#…

【学习】Web安全测试需要考虑哪些情形

一、数据加密 某些数据需要进行信息加密和过滤后才能在客户端和服务器之间进行传输&#xff0c;包括用户登录密码、信用卡信息等。例如&#xff0c;在登录某银行网站时&#xff0c;该网站必须支持SSL协议&#xff0c;通过浏览器访问该网站时&#xff0c;地址栏的http变成https…

中国中药有限公司邀您到场参观2024燕窝滋补品展

参展企业介绍 中国中药有限公司是中国医药集团有限公司&#xff08;简称“国药集团”&#xff09;的全资子公司&#xff0c;是国药集团中药产业板块的核心投资平台&#xff0c;也是中药一类新药、中药科技进步一等奖、中药保密品种——“人工麝香”全国总代理。 公司经营范围…

Python装饰器深度解析:提升代码效率与可读性的实战指南

Python装饰器深度解析&#xff1a;提升代码效率与可读性的实战指南 摘要装饰器简介定义及基本用途装饰器在Python中的角色 装饰器的工作原理Python函数的运行时特性首个装饰器示例&#xff1a;简单函数计时装饰器的执行流程解析 使用装饰器增强函数功能编写可重用的日志记录装饰…

AI论文速读 | 具有时间动态的路网语义增强表示学习

论文标题&#xff1a; Semantic-Enhanced Representation Learning for Road Networks with Temporal Dynamics 作者&#xff1a; Yile Chen&#xff08;陈亦乐&#xff09; ; Xiucheng Li&#xff08;李修成&#xff09;; Gao Cong&#xff08;丛高&#xff09; ; Zhifeng Ba…

web前端性能优化【多年工作经验总结,一举拿下】

浏览器方面&#xff1a; 减少HTTP请求 HTTP 请求是指客户端&#xff08;例如浏览器&#xff09;向服务器发出的请求消息&#xff0c;用于获取特定资源或执行特定操作 为什么能够优化性能&#xff1f; 减少网络延迟&#xff1a;每次发起HTTP请求都需要经过网络传输&#xff…