一篇文章教会你部署vue项目到docker

更新时间：2022年04月05日 11:34:29 作者：mad man

在前端开发中,部署项目是我们经常发生的事情,下面这篇文章主要给大家介绍了关于部署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镜像配置

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/

第二步，生成镜像

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

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

然后构建镜像完成

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

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

总结

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

您可能感兴趣的文章:

Vue中props组件和slot标签的区别
props 和 slot 在 Vue 中的作用略有不同，props 更多地用于父子组件之间的数据传递，而 slot 则更多地用于组件的复用和扩展。感兴趣的同学可以参考阅读
2023-04-04
Vue插槽具体用法及实例分析
本文主要介绍了Vue框架中插槽的使用方法和应用场景。通过具体实例分析，详细讲解了插槽的具体用法，帮助读者深入理解Vue中插槽的使用和实现方式
2023-05-05
封装一个Vue文件上传组件案例详情
这篇文章主要介绍了封装一个Vue文件上传组件案例详情，文章围绕主题展开详细的内容介绍，具有一定的参考价值，需要的小伙伴可以参考一下
2022-08-08
Vue+axios 实现http拦截及路由拦截实例
这篇文章主要介绍了Vue+axios 实现http拦截及路由拦截 ,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-04-04
vue draggable resizable gorkys与v-chart使用与总结
这篇文章主要介绍了vue draggable resizable gorkys与v-chart使用与总结,本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
2019-09-09
前端大文件上传与下载(分片上传)的详细过程
最近遇见一个需要上传超大大文件的需求,所以下面这篇文章主要给大家介绍了关于前端大文件上传与下载(分片上传)的详细过程,文中通过实例代码介绍的非常详细,需要的朋友可以参考下
2022-11-11
vue中销毁定时器的几种解决方案
这篇文章主要给大家介绍了关于vue中销毁定时器的几种解决方案,销毁定时器的操作一般是在beforeDestroy钩子中进行，根据定时器的数量不同可以有多种解决方法,需要的朋友可以参考下
2023-08-08
Vue3中Vuex状态管理学习实战示例详解
这篇文章主要为大家介绍了Vue3中Vuex状态管理学习实战示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-06-06
Vue的click事件防抖和节流处理详解
今天小编就为大家分享一篇Vue的click事件防抖和节流处理详解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2019-11-11
Vue中使用Printjs插件实现打印功能
Print.js 主要是为了帮助我们直接在我们的应用程序中打印 PDF 文件，无需离开界面，也无需使用嵌入，这篇文章主要介绍了Vue中使用Printjs插件实现打印功能,需要的朋友可以参考下
2022-08-08