写在前面
ps:因为docker容器如果没有配置统一网络的话,如果vue使用localhost连接后端是会连接失败的。两种方法,一是配置统一网络,二是将localhost改成云服务器ip。
一、将本地vue和springboot项目打包
1、vue项目打包命令
npm run buide
2、springboot项目打包
maven中的package命令
二、构建vue前端镜像
1、将vue打包生成的disk文件上传到云服务器
cd /home
mkdir time_todolist
mkdir vue_time
2、将disk文件放入vue_time文件夹下
3、在同文件夹下(vue_time)编写Dockerfile文件
touch Dockerfile
vim Dockerfile
# 设置基础镜像
FROM nginx:1.15
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/ /usr/share/nginx/html/
# 暴露端口
EXPOSE 80
4、运行打包命令打包成docker镜像
# vue_time为自定义镜像名字
[root@iZ8vb9n5juyckzozuq2wgfZ vue_time] docker build -t vue_time .
5、查看镜像
docker images
[root@iZ8vb9n5juyckzozuq2wgfZ vue_time]# docker images
REPOSITORY TAG IMAGE ID CREATED SIZE
vue_time latest f7c9e8631b97 17 hours ago 110MB
springboot_time latest c7f1f7aba95b 17 hours ago 722MB
mysql 5.7 f07dfa83b528 13 days ago 448MB
openjdk latest e105e26a0a75 2 weeks ago 486MB
tomcat latest feba8d001e3f 2 weeks ago 649MB
nginx latest ae2feff98a0c 2 weeks ago 133MB
mysql latest ab2f358b8612 3 weeks ago 545MB
mysql 8.0.18 ed1ffcb5eff3 12 months ago 456MB
nginx 1.15 53f3fd8007f7 20 months ago 109MB
java 8 d23bdf5b1b1b 3 years ago 643MB
java latest d23bdf5b1b1b 3 years ago 643MB
6、运行镜像
docker run -d --name vue_time -p 80:80 vue_time
7、查看容器是否成功
docker ps
[root@iZ8vb9n5juyckzozuq2wgfZ vue_time] docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
c3de18f2083c vue_time "nginx -g 'daemon of…" 17 hours ago Up 17 hours 0.0.0.0:80->80/tcp vue_time
三、构建springboot后端镜像
1、将springboot打包好的jar包传到云服务器
cd /home/time_todolist
mkdir springboot_time
2、将jar文件放入springboot_time文件夹下
3、在同文件夹下(springboot_time)编写Dockerfile文件
touch Dockerfile
vim Dockerfile
FROM java:8
VOLUME /tmp
ADD retime-0.0.1-SNAPSHOT.jar /app.jar
RUN sh -c 'touch /app.jar'
ENV JAVA_OPTS=""
ENTRYPOINT [ "sh", "-c", "java $JAVA_OPTS -Djava.security.egd=file:/dev/./urandom -jar /app.jar" ]
4、运行打包命令打包成docker镜像
# springboot_time为自定义镜像名字
[root@iZ8vb9n5juyckzozuq2wgfZ springboot_time] docker build -t springboot_time .
5、查看镜像
docker images
[root@iZ8vb9n5juyckzozuq2wgfZ vue_time]# docker images
REPOSITORY TAG IMAGE ID CREATED SIZE
vue_time latest f7c9e8631b97 17 hours ago 110MB
springboot_time latest c7f1f7aba95b 17 hours ago 722MB
mysql 5.7 f07dfa83b528 13 days ago 448MB
openjdk latest e105e26a0a75 2 weeks ago 486MB
tomcat latest feba8d001e3f 2 weeks ago 649MB
nginx latest ae2feff98a0c 2 weeks ago 133MB
mysql latest ab2f358b8612 3 weeks ago 545MB
mysql 8.0.18 ed1ffcb5eff3 12 months ago 456MB
nginx 1.15 53f3fd8007f7 20 months ago 109MB
java 8 d23bdf5b1b1b 3 years ago 643MB
java latest d23bdf5b1b1b 3 years ago 643MB
6、运行容器
docker run -d --name springboot_time -p 9002:9002 springboot_time
7、查看容器是否成功
[root@iZ8vb9n5juyckzozuq2wgfZ springboot_time]# docker ps
CONTAINER ID IMAGE COMMAND CREATED STATUS PORTS NAMES
c3de18f2083c vue_time "nginx -g 'daemon of…" 17 hours ago Up 17 hours 0.0.0.0:80->80/tcp vue_time
8da53c2a0c9d springboot_time "sh -c 'java $JAVA_O…" 17 hours ago Up 17 hours springboot_time
四、拉取mysql镜像
1、使用docker拉取mysql镜像
docker pull mysql:5.7
2、运行mysql容器
docker run -d --name vue_mysql -p 3306:3306 mysql:5.7
3、进入mysql容器并配置密码
docker exec -it vue_mysql /bin/bash
# 改密码方面就不再赘述了
五、完成