1.将vue项目和springboot项目放在同一个文件夹

并建立docker-compose.yml文件

version: "3"
services:
  leaflet:
    build: ./vue-leaflet
    restart: always
    ports: 
      - 80:80
    depends_on:
      - project
  project:
    build: ./vueproject
    restart: always
    ports:
      - 18080:18080

2.vue项目下新建Dockerfile

# 设置基础镜像
FROM nginx:1.15
# 定义作者
MAINTAINER chijiandi <chijiandi@mobike.com>
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/  /usr/share/nginx/html/
COPY nginx.conf /etc/nginx/conf.d/nginx.conf

EXPOSE 80

3.springboot项目下新建Dockerfile

#从dcokerhub上拉取openjdk8
FROM openjdk:8-jdk-alpine
MAINTAINER "chijiandi" <chijiandi@mobike.com>

#在宿主机的/var/lib/docker目录下创建一个临时文件并把它链接到容器中的/tmp目录
VOLUME /tmp

#拷贝打包后的jar包并且重命名
ADD target/*.jar app.jar

#容器外露到服务器的端口
EXPOSE 18080

# 为了缩短 Tomcat 的启动时间，添加java.security.egd的系统属性指向/dev/urandom作为 ENTRYPOINT
ENTRYPOINT ["java","-Djava.security.egd=file:/dev/./urandom", "-Dserver.port=18080","-jar","/app.jar"]

至vue项目下构建

npm run install

至springboot项目下构建

mvn clean install

至根目录构建

docker-compose up --build -d 

运行后本地docker会直接运行镜像