docker部署vue项目(vue + docker + nginx)

qiuJun998

已于 2023-10-06 15:10:02 修改

阅读量2.8k

点赞数 1

分类专栏：后端前段文章标签： docker nginx vue.js

于 2022-10-23 15:55:41 首次发布

本文链接：https://blog.csdn.net/qq_35911118/article/details/127475956

版权

后端同时被 2 个专栏收录

100 篇文章 0 订阅

订阅专栏

前段

37 篇文章 1 订阅

订阅专栏

1.建立一个文件夹 ：mkdir 文件夹名 如：mkdir study
2.查看是否成功 ls
3.进入到创建的文件夹中 cd 文件夹名 如：cd study
4.安装docker 指令：yum install -y docker-engine
5.查看是否安装成功 指令：docker version
6.启动docker 指令：systemctl start docker
7.查看启动状态 指令：systemctl status docker
8.获取nginx镜像 指令：docker pull nginx
9.启动docker中的Nginx容器，命名为nginx-test，并将服务器的8080端口和容器的80端口映射。 
指令：docker run -p 80:80 --name nginx-test nginx
10.在第一步创建的文件夹中创建文件 default.conf 和 Dockerfile指令 
touch default.conf 和 touch Dockerfile
11.创建好后编辑第一个文件default.conf ，
指令 vim default.conf
内容如下：
server {
    listen       80;
    server_name  localhost;

    #charset koi8-r;
    access_log  /var/log/nginx/host.access.log  main;
    error_log  /var/log/nginx/error.log  error;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }

    #error_page  404              /404.html;

    # redirect server error pages to the static page /50x.html
    # 
    error_page   500 502 503 504  /50x.html; 
    location = /50x.html {
        root   /usr/share/nginx/html;
    }    
}       
12.编辑第二个文件Dockerfile ，
指令 vim Dockerfile
内容如下：
FROM nginx
MAINTAINER zouzou
RUN rm /etc/nginx/conf.d/default.conf
ADD default.conf /etc/nginx/conf.d/
COPY dist/ /usr/share/nginx/html/
13.压缩后的那个dist.zip拖到Xshell中，直接拖过来
注意：要是进度条不动，先下载个lrzsz ，然后在拖进来就没问题
指令：yum -y install lrzsz
14.接下来解压dist.zip 
指令: unzip dist.zip
15.好了后，构建docker镜像 
指令： build -t 镜像名称 . 如：docker build -t zz-mms .(注意后面的 . 一定不能少)
16查看是否创建成功 
指令：docker images
17.启动一个docker容器，也是最后一步docker run -d -p 端口名:80 --name 容器名 刚才建立的镜像名称
如：
docker run -d -p 9090:80 --name mms zz-mms
18.接下来我们查看下启动的容器 docker ps