1、解压压缩包文件 (所需压缩包跟文件在本文章的最下角)
(1)使用软件Xftp连接主机,并将jdk-11.0.24_linux-x64_bin.tar.gz和Dockerfile文件复制到这个目录(如果没有这个目录那么照着我这个图片上的路径一个一个新建)

回到主机先输入命令:
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation导航到这个目录,然后使用命令tar -zxvf jdk-11.0.24_linux-x64_bin.tar.gz解压这个压缩包到该目录


(2)其实跟前面差不多都是先用Xftp复制maven压缩包到我图片中的这个目录(没有这个目录就新建),然后在主机输入命令:
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation导航到该目录,(这里需要注意的是maven这个压缩包的格式是zip,需要先安装解压工具sudo yum install unzip)然后再用命令unzip apache-maven-3.8.1-bin.zip解压。

2、编辑环境配置
先输入sudo vi /etc/profile进入配置,然后滑到最下面,按 i 进入修改模式,将以下命令添加到配置中:
export MAVEN_HOME=/root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1
export PATH=$MAVEN_HOME/bin:$PATH
export JAVA_HOME=/root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation/jdk-11.0.24
export PATH=$JAVA_HOME/bin:$PATH

配置完后先按esc然后按shift+ ;一起按,会弹出来一个: 然后再输入wq按回车
使配置立即生效输入source /etc/profile
再输入mvn -version,如果输出以下配置则说明配好了

在主机以下命令导航到该目录:
cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.JAVA_JDKInstallation
docker build -t java:11 .     (基于当前目录下的 Dockerfile 构建一个名为 java:11 的 Docker 镜像)

输入 docker images 查看有没有这个 java 的镜像文件 (custom_nvm 这个镜像文件后面也会配,如果你没有先别急)

3、先将所需文件复制粘粘到主机上 (所需文件下载在文章最下角链接) (如图所示目录没有就新建)
项目前端部分文件:

项目后端部分文件:

4、先部署后端
在图片中的路径下新建一个新的hudson.tasks.Maven_repos文件夹 (该文件夹后续用来当云仓库)

将settings-yanxikeji.xml放到如图所示目录: (所需文件下载链接在文章最下面)

然后返回主机输入以下命令:
Linux> cd /root/docker/volumes/blog/APIServer/personal_blog (切换当前工作目录到指定路径)
Linux> mvn -v (检查 Maven 的版本信息)
Linux> mvn clean -s /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1/conf/settings-yanxikeji.xml -e -X (使用 Maven 清理项目构建文件,并指定自定义配置和调试选项)

Linux>mvn package -s /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.Maven_MavenInstallation/apache-maven-3.8.1/conf/settings-yanxikeji.xml (使用 Maven 对项目进行打包(package),并指定了一个自定义的Maven配置文件(settings.xml))

Linux>docker run –name personal_blog_java_11 –restart always -i -d -p 9898:8080 -v /root/docker/volumes/var/jenkins_home:/var/jenkins_home -v /root/docker/volumes/blog/APIServer/personal_blog:/usr/local/app/personal_blog java:11(启动一个名为 personal_blog_java_11 的容器,这里需要记得去安全组开放9898端口)
Linux>docker exec -it personal_blog_java_11 /bin/bash (进入personal_blog_java_11容器)
Docker>nohup java -jar blog-backend-1.0.0.jar > blog-backend-1.0.0_all.log 2>&1 & (在后台运行 Java JAR 包,并将所有输出重定向到日志文件)
Docker>cd /usr/local/app/personal_blog/target (进入这个目录)
Docker>tail -f -n 50 blog-backend-1.0.0_all.log (实时查看日志文件的最后 50 行)

如同所示就代表运行成功了
5、再来部署前端
在该图所示的路径下放一个custom-nvm-Dockerfile文件 (所需下载链接在文章最下面)

Linux>cd /root/docker/volumes/var/jenkins_home/tools/hudson.tasks.nvmInstallation/nvm/v0.40.1 (导航到该目录)
Linux>docker build -t custom_nvm:0.40.1 -f ./custom-nvm-Dockerfile . (通过 Dockerfile 构建一个自定义的 Docker 镜像)
Linux>docker images (查看镜像文件,这下应该都会有两个镜像文件了)

Linux>docker run –name custom_nvm_0.40.1 –restart always -p 8081:3000 -v /root/docker/volumes/nvm/usr/local/nvm/v0.40.1:/usr/local/nvm/v0.40.1 -d custom_nvm:0.40.1 (这里需要注意8081端口是否被占用或未开放)
Linux> docker exec -it custom_nvm_0.40.1 /bin/bash (进入custom_nvm_0.40.1容器)
Docker>nvm i 18.19.0 (用nvm下载node的18.19.0版本)
Docker>node -v (查看node版本是否成功下载)
Docker>npm i -g @vue/cli (用于 全局安装 Vue.js 的官方命令行工具)
Docker> npm list -g –depth 0 (用于列出全局安装的 npm 包)
Docker>cd personal_blog/Vue3 (导航到以下目录) <—(如果你之前运行过项目就直接跳到这一步)
Docker>npm run serve (运行前端项目)

如图所示就代表前端项目成功运行
6、接下来进入网站
在浏览器新开一个窗口

然后输入你的公网ip加你前端的端口号,回车就能进入了
补充:如果你不知道你前端的端口号
在主机输入命令docker ps -a,查看你的custom_nvm_0.40.1容器的映射端口就是你的前端(比如我这里的8081就是我的前端端口);对应的你的personal_blog_java_11的映射端口就是你的后端端口

百度网盘链接:https://pan.baidu.com/s/12bLtfSStld5zC7H-2aPO8w?pwd=4tvd








泰酷辣
哈哈
必须狠狠学