教你部署vue项目到docker


Posted in Vue.js onApril 05, 2022

让我在5分钟你教不会你把项目部署到docker,前提是你得服务器装有docker,这里方便装宝塔,大佬当我没说。

教你部署vue项目到docker

大致分为3步:

第一是弄一个nginx的配置文件然后构建镜像的时候把它放进去取代原来的配置和写Dockerfile生成镜像的一些配置

第二是生成镜像

第三是生成启动容器,ok开始,顺便抛砖引玉

第一步

教你部署vue项目到docker

教你部署vue项目到docker

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;
}
}

写docker镜像配置

教你部署vue项目到docker

教你部署vue项目到docker

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

教你部署vue项目到docker

第二步,生成镜像 

来到当前文件夹,输入命令 docker build -t yaohot .

注意图上打错字了,yoahou,以图片的命令为主

教你部署vue项目到docker

 然后构建镜像完成

教你部署vue项目到docker

第三步,生成(启动)一个容器

命令:docker run -d -p 86:80 --name houtai yaohot

教你部署vue项目到docker

 ok

教你部署vue项目到docker

教你部署vue项目到docker

总结

到此这篇关于部署vue项目到docker的文章就介绍到这了,更多相关部署vue项目到docker内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Vue.js 相关文章推荐
在Vue中使用CSS3实现内容无缝滚动的示例代码
Nov 27 Vue.js
Vue实现图书管理小案例
Dec 03 Vue.js
在vue中使用inheritAttrs实现组件的扩展性介绍
Dec 07 Vue.js
Vue使用鼠标在Canvas上绘制矩形
Dec 24 Vue.js
Vue通过阿里云oss的url连接直接下载文件并修改文件名的方法
Dec 25 Vue.js
vue 动态生成拓扑图的示例
Jan 03 Vue.js
vue实现防抖的实例代码
Jan 11 Vue.js
vue使用过滤器格式化日期
Jan 20 Vue.js
Vue的列表之渲染,排序,过滤详解
Feb 24 Vue.js
vue-cli3.0修改打包后的文件名和文件地址,打包后本地运行报错解决
Apr 06 Vue.js
vue实现列表拖拽排序的示例代码
Apr 08 Vue.js
vue使用wavesurfer.js解决音频可视化播放问题
Apr 04 #Vue.js
vue中div禁止点击事件的实现
Apr 02 #Vue.js
Vue组件更新数据v-model不生效的解决
Apr 02 #Vue.js
Vue+TypeScript中处理computed方式
Apr 02 #Vue.js
Vue+Flask实现图片传输功能
Apr 01 #Vue.js
在vue中import()语法不能传入变量的问题及解决
Apr 01 #Vue.js
Vue中使用import进行路由懒加载的原理分析
Apr 01 #Vue.js
You might like
下载文件的点击数回填
2006/10/09 PHP
php 模拟POST|GET操作实现代码
2010/07/20 PHP
snoopy 强大的PHP采集类使用实例代码
2010/12/09 PHP
PHP编程中的常见漏洞和代码实例
2014/08/06 PHP
thinkPHP5.0框架URL访问方法详解
2017/03/18 PHP
PHP设计模式之工厂模式(Factory Pattern)的讲解
2019/03/21 PHP
PHP使用mysqli同时执行多条sql查询语句的实例
2019/03/22 PHP
PHP 判断字符串是中文还是英文, 或者是中英混合
2021/03/09 PHP
脚本吧 - 幻宇工作室用到js,超强推荐base.js
2006/12/23 Javascript
JavaScript网页制作特殊效果用随机数
2007/05/22 Javascript
document.compatMode介绍
2009/05/21 Javascript
仿百度的关键词匹配搜索示例
2013/09/25 Javascript
Angular之指令Directive用法详解
2017/03/01 Javascript
js脚本编写简单刷票投票系统
2017/06/27 Javascript
微信小程序之分享页面如何返回首页的示例
2018/03/28 Javascript
基于Vue 实现一个中规中矩loading组件
2019/04/03 Javascript
javascript中call,apply,callee,caller用法实例分析
2019/07/24 Javascript
python sort、sorted高级排序技巧
2014/11/21 Python
django使用图片延时加载引起后台404错误
2017/04/18 Python
Python OpenCV处理图像之图像直方图和反向投影
2018/07/10 Python
使用Python实现正态分布、正态分布采样
2019/11/20 Python
python自动下载图片的方法示例
2020/03/25 Python
Python Numpy中数据的常用保存与读取方法
2020/04/01 Python
StubHub澳大利亚:购买或出售您的门票
2019/08/01 全球购物
英国奢华护肤、美容和Spa品牌:Temple Spa
2019/11/02 全球购物
C++面试题目
2013/06/25 面试题
路由表示做什么用的?在linux环境中怎么来配置一条默认路由?
2013/06/07 面试题
协议书与合同的区别
2014/04/18 职场文书
大学毕业生推荐信
2014/07/09 职场文书
规范化管理年活动总结
2014/08/29 职场文书
办公室文员工作自我鉴定
2014/09/19 职场文书
无子女夫妻离婚协议书(4篇)
2014/10/20 职场文书
总经理岗位职责范本
2015/04/01 职场文书
2016年基层党支部书记公开承诺书
2016/03/25 职场文书
微软Win11有哪些隐藏功能? windows11多个功能汇总
2021/11/21 数码科技
面试分析分布式架构Redis热点key大Value解决方案
2022/03/13 Redis