轻松Docker+Nginx 部署Vue前端项目

aapprentice

于 2024-03-01 19:21:21 发布

阅读量752

点赞数 11

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/aapprentice/article/details/136397934

本文详细介绍了如何使用Docker进行项目部署，包括准备dist文件、编写Dockerfile，创建和运行镜像，配置Nginx监听端口、域名及路由，最终实现前端项目的访问。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

前期准备

准备好打包的dist文件夹
创建一个文件夹,将打包好的文件移动到文件夹里
在文件夹里创建dockerfile
文件结构如下

编辑DockerFile

# 设置基础镜像
FROM nginx
# 更新 apt 软件包索引并安装 vim
RUN apt-get update
RUN apt-get install -y vim
# 将dist文件中的内容复制到 /usr/share/nginx/html/ 这个目录下面
COPY dist/  /usr/share/nginx/html/

创建镜像

保存退出Dockefile,并根据其创建镜像

sudo docker build -t 镜像名 dockerfile路径

在这里插入图片描述

查看镜像

最低0.47元/天解锁文章