dockerfile部署前端vue打包的dist文件实战

背景:一般前端开发后会将打包后的dist文件交由我们部署,部署的方式有很多,这里提供一种思路

在服务器的路径下新建一个目录,在目录中新建Dockerfile,编辑这个文件

java 复制代码
FROM nginx

COPY ./dist  /home/front
COPY nginx.conf /etc/nginx/nginx.conf

执行(注意后面有一个空格和英文的句号)

bash 复制代码
docker build -t image_name:version .

运行镜像生成容器

bash 复制代码
docker run -id --name contain_name -p server_port:contain_port  --restart always image_name:version
相关推荐
云飞云共享云桌面3 分钟前
SolidWorks如何实现多人共享
服务器·前端·数据库·人工智能·3d
晚霞的不甘4 分钟前
Flutter for OpenHarmony《智慧字典》 App 底部导航栏深度解析:构建多页面应用的核心骨架
前端·经验分享·flutter·ui·前端框架·知识图谱
h7ml5 分钟前
电商返利系统中佣金计算的幂等性保障与对账补偿机制实现
服务器·前端·php
EndingCoder6 分钟前
高级项目:构建一个 CLI 工具
大数据·开发语言·前端·javascript·elasticsearch·搜索引擎·typescript
boy快快长大7 分钟前
Docker简单服务迁移
运维·docker·容器
RFCEO9 分钟前
HTML元素+网页布局区块概念汇总表
前端·html·html编程基础课·html元素汇总表·html元素位置展示
Dawndddddd19 分钟前
XSS知识点总结
前端·xss
风之舞_yjf24 分钟前
Vue基础(26)_单文件组件
前端·vue.js
weixin_4222013025 分钟前
Element Plus中el-tree组件默认选中第一个节点的实现方法
前端·javascript·vue.js
_OP_CHEN25 分钟前
【前端开发之CSS】(六)CSS 弹性布局(Flex)完全指南:从入门到精通,搞定所有布局需求
前端·css·html·flex布局·弹性布局·界面美化·页面开发