用docker compose部署vue+springboot最简单教程

1.首先需要安装docker和docker compose

2.把需要的文件放在linux服务器中，可以用termius软件连接服务器，有界面可以传输文件进服务器

一、部署web前端

在linux服务器中放置文件目录/home/ubuntu/teachweb

teachweb里面存放的文件有compose.yaml，default.conf ，dist文件夹， Dockerfile

dist文件夹是vue或者其他前端打包后的文件夹，详情可以看下面blog，打包生成dist文件
手摸手教你用Docker部署web前端vue项目_docker部署vue的前端项目-CSDN博客

default.conf的内容

复制代码

server {
    listen       80;
    server_name  localhost; # 修改为docker服务宿主机的ip
 
    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html =404;
    }
 
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
}

Dockerfile的内容

复制代码

FROM nginx
 
MAINTAINER onesummer
 
RUN rm /etc/nginx/conf.d/default.conf
 
ADD default.conf /etc/nginx/conf.d/
 
COPY dist/ /usr/share/nginx/html/

compose.yaml内容

复制代码

services:
  teachweb_first:
    build:
      context: .
      dockerfile: Dockerfile
    container_name: teachImages_first
    restart: always
    ports:
      - "88:80"
    volumes:
      - ./dist:/usr/share/nginx/html
      - ./default.conf:/etc/nginx/conf.d/default.conf

在相同目录下运行命令，就可以成功生成容器，前端运行成功

复制代码

docker compose up -d

在浏览器输入IP+端口号就能看到网页内容了

docker compose down是删除容器的命令.

当需要更新网页的时候，把本地打包好的dist替换服务器中的dist，先运行docker compose down删除容器，再docker compose up新建一个容器。

二、部署springboot后端

在linux服务器中放置文件目录/home/ubuntu/AI_Platform_Back

AI_Platform_Back里面存放的文件有compose.yaml，jar包， Dockerfile

jar包是springboot后端打包后的文件夹，详情可以看下面blog，打包生成jar

手摸手教你使用Docker部署Springboot项目（详细版）_springboot dockerfile 端口映射-CSDN博客

Dockerfile的内容

复制代码

FROM maven:3.8.1-jdk-8-slim as builder

ADD ./***（jar包名字）.jar app.jar

EXPOSE 8101

CMD java -jar app.jar

compose.yaml内容

复制代码

services:
  app:
    build:
      context: .
      dockerfile: Dockerfile
    container_name: ai_platform_back
    ports:
      - "89:89"
    restart: always

在相同目录下运行命令，就可以成功生成容器，后端运行成功

复制代码

docker compose up -d