用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
相关推荐
程序员凡尘23 分钟前
完美解决 Array 方法 (map/filter/reduce) 不按预期工作 的正确解决方法,亲测有效!!!
前端·javascript·vue.js
爱上语文2 小时前
Springboot的三层架构
java·开发语言·spring boot·后端·spring
荆州克莱2 小时前
springcloud整合nacos、sentinal、springcloud-gateway,springboot security、oauth2总结
spring boot·spring·spring cloud·css3·技术
serve the people2 小时前
springboot 单独新建一个文件实时写数据,当文件大于100M时按照日期时间做文件名进行归档
java·spring boot·后端
m0_741768856 小时前
使用docker的小例子
运维·docker·容器
Bug缔造者6 小时前
Element-ui el-table 全局表格排序
前端·javascript·vue.js
xnian_7 小时前
解决ruoyi-vue-pro-master框架引入报错,启动报错问题
前端·javascript·vue.js
罗政7 小时前
[附源码]超简洁个人博客网站搭建+SpringBoot+Vue前后端分离
vue.js·spring boot·后端
阿树梢8 小时前
【Vue】VueRouter路由
前端·javascript·vue.js
最新小梦9 小时前
Docker日志管理
运维·docker·容器