龙空技术网

如何在Docker中打包部署Vue项目

简单d猫 493

前言:

今天各位老铁们对“linuxnginxhtml目录”都比较关注,我们都想要学习一些“linuxnginxhtml目录”的相关文章。那么小编在网络上汇集了一些有关“linuxnginxhtml目录””的相关资讯,希望你们能喜欢,兄弟们一起来学习一下吧!

1、vue 项目打包 dist

2、拷贝dist整个文件夹到Linux Service目录下(也可以通过压缩解压方式上传)

//解压dist压缩文件unzip dist.zip//在该目录下创建default.confvi default.confserver {     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;     }}//创建Dockerfilevi Dockerfile//该镜像是基于nginx:latest镜像构建的FROM nginx//添加说明    MAINTAINER zr  //删除目录下的default.conf文件   RUN rm /etc/nginx/conf.d/default.conf//将default.conf复制到/etc/nginx/conf.d/下,用本地的default.conf配置来替换nginx镜像里的默认配置    ADD default.conf /etc/nginx/conf.d/  //将项目根目录下dist文件夹(构建之后才会生成)下的所有文件复制到镜像/usr/share/nginx/html/目录下COPY dist/ /usr/share/nginx/html///确保 dist, default.conf,Dockerfile 同个目录下

3、拉取nginx镜像

docker pull nginx

4、构建vue项目的镜像

docker build -t xxxx .   //xxxx构建镜像名称

5、启动项目镜像

docker run -d -p 8887:80 --name web xxxx

标签: #linuxnginxhtml目录