Windows docker vue打成镜像运行部署(前端)

news/2024/10/18 18:21:17/

1.准备工作 :前端(dist)包 和 dockerfile编写和Nginx 配置文件default.conf编写
dockerfile

FROM nginxMAINTAINER boy:firstwebRUN rm /etc/nginx/conf.d/default.confADD default.conf /etc/nginx/conf.d/COPY dist/ /usr/share/nginx/html/

default.conf

server {listen       80;server_name   192.168.1.16; # 修改为docker服务宿主机的iplocation / {root   /usr/share/nginx/html;index  index.html index.htm;try_files $uri $uri/ /index.html =404;}location /prod-api { # prod-api是vue项目里.env.production里的地址rewrite ^/prod-api/(.*)$ /$1 break;   # 替换后端访问的路径prod-api为""proxy_pass http://192.168.1.16:8080;  # 这里写的是你后端接口的地址}error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}
}

2.构建镜像
将打包好的vue包放入Dockerfile和default.conf统一文件下
在这里插入图片描述
构建命令(切换到上述文件的路径下执行)

docker build -t "ruoyi-vue" .

在这里插入图片描述

3.根据镜像创建容器并运行

docker run -d -p 9090:80 --name ruoyi-vue ruoyi-vue

在这里插入图片描述
运行成功
在这里插入图片描述


http://www.ppmy.cn/news/128984.html

相关文章

[Halcon] WriteImage保存图像崩溃问题

📢博客主页:https://loewen.blog.csdn.net📢欢迎点赞 👍 收藏 ⭐留言 📝 如有错误敬请指正!📢本文由 丶布布原创,首发于 CSDN,转载注明出处🙉📢现…

echarts图表格式记录

单柱图/单条形图 chartData: {axisData: [Mon, Tue, Wed, Thu, Fri, Sat, Sun],seriesData: [120, 200, 150, 80, 70, 110, 130] }单柱图标线 chartData: {axisData: [Mon, Tue, Wed, Thu, Fri, Sat, Sun],seriesData: [120, 200, 150, 80, 70, 110, 130],// 标线数据markDat…

绘图杂记【1】Python、R等绘图

pyhton代码和echarts代码 option {toolbox: {show: true,feature: {dataView: {show:true},saveAsImage: {//excludeComponents :[toolbox],pixelRatio: 20}} },tooltip: {legend: {},trigger: axis,axisPointer: {type: none},formatter: function (params) {return params…

迪杰斯特拉算法详解+模版+例题

迪杰斯特拉算法(Dijkstra)是由荷兰计算机科学家狄克斯特拉于1959 年提出的,因此又叫狄克斯特拉算法。是从一个顶点到其余各顶点的最短路径算法,解决的是有权图中最短路径问题。迪杰斯特拉算法主要特点是从起始点开始,采用贪心算法的策略&…

Python中列表,元组,字典的一些基本用法

一 列表: 创建列表: 列表变量名 [元素1,元素2,元素3,…]; 列表元素的访问: 使用索引访问例如: >>> money[10,11,12,20] >>> money[1] 11 >>> money[0] 10 >>…

(转)make的常见错误信息

(转)make的常见错误信息 make执行过程中所产生错误并不都是致命的;特别是在命令行之前存在“-”、或者make使用“-k”选项执行时。make执行过程的致命错误都带有前缀字符串“***”。 错误信息都有前缀,一种是执行程序名作为错误前缀(通常是“…

Android实验五-组件通信2

5.2、Intent对象 Intent是一种轻量级消息传递机制,旨在解决各项组件之间的通信问题。它描述了应用中一次操作的动作、动作涉及数据、附加数据,Android则根据此描述,负责找到对应的组件,将 Intent传递给调用的组件,并完…

金刚石切割丝的全球与中国市场2022-2028年:技术、参与者、趋势、市场规模及占有率研究报告

本文研究全球与中国市场金刚石切割丝的发展现状及未来发展趋势,分别从生产和消费的角度分析金刚石切割丝的主要生产地区、主要消费地区以及主要的生产商。重点分析全球与中国市场的主要厂商产品特点、产品规格、不同规格产品的价格、产量、产值及全球和中国市场主要…