Docker打包前后端项目的实现示例

1.打包应用

mvn clean package -DskipTests

2.新建dockerfile

FROM  openjdk:8
#设置工作目录
WORKDIR  /workspace

#COPY  wms-app-0.0.1-SNAPSHOT.jar /workspace/app.jar
ADD  wms-app-0.0.1-SNAPSHOT.jar  app.jar
#配置容器暴漏的端口
EXPOSE 8080
#查看是否已经copy进去
#RUN  ls 
#java App
ENTRYPOINT  ["java","-jar","app.jar"]

3.打包镜像

docker build -t mall:v1 .

4.测试运行

--rm 代表退出之后，容器移动删除

docker run -it --rm beimao:v1

5.使用阿里云免费私仓

阿里云登录 - 欢迎登录阿里云，安全稳定的云计算服务平台

Vue前端项目打包

编译打包

npm run build

前端项目 nginx的配置文件default.conf 和 dockerfile

default.conf

upstream wms-app {
    server 192.168.14.3:3666 ;
    server 192.168.14.3:3777 ;
}
server {
    listen       80;
    listen  [::]:80;
    server_name  localhost;

    access_log  /var/log/nginx/host.access.log  main;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html; #解决单页面找不到路径问题 404
    }
   
    location /api/ {
            add_header 'Access-Control-Allow-Origin' '*';
            add_header 'Access-Control-Allow-Methods' 'POST,GET,OPTIONS';
            add_header 'Access-Control-Allow-Headers' 'Authorization'; #跨域设置
            proxy_pass http://wms-app ;  #可以配置多个下游服务，具有负载功能
            #proxy_pass http://192.168.14.3:3666; #仅配置一个下游服务，不具有负载均衡能力

    }
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }


}

1.root：设置静态根目录为 /usr/share/nginx/html

2. index：设置目录的默认文件为 index.html 、index.htm、index.php

3. try_files：设置文件查找规则为 $uri $uri/ /index.html。即3个规则，先从 $uri 查找，再从 u r i / 目录中查找，最后查找 / i n d e x . h t m l 。

dockerfile

FROM nginx
COPY html /usr/share/nginx/html
RUN rm -f /etc/nginx/conf.d/default.conf
ADD default.conf /etc/nginx/conf.d/default.conf

构建镜像

docker build -t web:v1 .

运行

docker  run -it -p 8086:80  web:v1

到此这篇关于Docker打包前后端项目的实现示例的文章就介绍到这了,更多相关Docker打包前后端项目内容请搜索以前的文章或继续浏览下面的相关文章希望大家以后多多支持！