使用 docker 构建镜像文件，实现一次构建处处使用，从而减少开发难度。
本文使用 web静态文件 与 vue开发文件 为例，使用 Dockerfile 构建docker镜像。

使用 docker 构建镜像文件的方法

使用 docker 构建镜像文件，实现一次构建处处使用，从而减少开发难度。

1. Dockerfile 文件中相关指令

Dockerfile 是一个用来构建镜像的文本文件，文本内容包含了一条条构建镜像所需的指令和说明。

相关指令含义：

FROM：镜像的基础系统环境

格式：
FROM nginx 或 FROM node:latest

RUN：用于执行后面跟着的命令行命令

有两种格式：
RUN <命令>
RUN ["可执行文件","参数1","参数2"]

COPY ：复制指令，从上下文目录中复制文件或者目录到容器里指定路径。

有两种格式：
COPY <原路径> <目标路径>
COPY ["<原路径>", "<目标路径>"]

<目标路径>：容器内的指定路径，该路径不用事先建好，路径不存在的话，会自动创建。

ADD：ADD 指令和 COPY 的使用格式类似（同样需求下，官方推荐使用 COPY），功能也类似。

CMD：为启动的容器指定默认要运行的程序，程序运行结束，容器也就结束。CMD 指令指定的程序可被 docker run 命令行参数中指定要运行的程序所覆盖。

类似于 RUN 指令，用于运行程序，但二者运行的时间点不同：

  • RUN 是在 docker build 时运行的
  • CMD 是在 docker run 时运行的

注意：如果 Dockerfile 中如果存在多个 CMD 指令，仅最后一个生效。

格式：
CMD <命令>
CMD ["可执行文件","参数1","参数2"]

ENV：设置环境变量，定义了环境变量，那么在后续的指令中，就可以使用这个环境变量。

格式：
ENV <key> <value>
ENV <key1>=<value1> <key2>=<value2>

若设置 NODE_VERSION = 7.2.0 ， 在后续的指令中可以通过 $NODE_VERSION 引用

EXPOSE： 仅仅只是声明端口

  • 帮助镜像使用者理解这个镜像服务的守护端口，以方便配置映射。
  • 运行时使用随机端口映射时，也就是 docker run -P 时，会自动随机映射 EXPOSE 的端口。

WORKDIR：指定工作目录。

用 WORKDIR 指定的工作目录，会在构建镜像的每一层中都存在。以后各层的当前目录就被改为指定的目录，如该目录不存在，WORKDIR 会帮你建立目录。
docker build 构建镜像过程中的，每一个 RUN 命令都是新建的一层。只有通过 WORKDIR 创建的目录才会一直存在。

格式：
WORKDIR <工作目录路径>

2. 静态网站的 docker 镜像创建

2.1 首先需要在一个文件夹中准备三个文件（夹）

  • 静态网站所在目录 /dist
  • Dockerfile 镜像构建文件
  • default.conf nginx默认配置文件
    在这里插入图片描述

2.2 Dockerfile 文件内容

# 拉取 nginx 镜像
FROM nginx:latest 

# 将静态网站文件夹拷贝到 nginx 镜像中的对应文件夹中
COPY ./dist /usr/share/nginx/html/ 

# 将 nginx 配置文件拷贝到 nginx 镜像中对应文件夹中
COPY ./default.conf /etc/nginx/conf.d/ 

# 声明暴露端口号为 9000
EXPOSE 9000

2.3 default.conf 文件内容

server {
    # nginx 监听的端口号，对外暴露端口
    listen 9000;
    server_name localhost;
    gzip on;
    gzip_min_length 1k;
    gzip_comp_level 9;
    gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml;
    gzip_vary on;
    gzip_disable "MSIE [1-6]\.";
    # 路径匹配
    location / {
        # 静态文件所在文件夹，需与 Dockerfile 中配置一样
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html;
    }
}

default.conf 中配置了网站对外暴露端口，最好与 Dockerfile 文件中端口一致

2.4 构建 docker 镜像并运行 docker 容器

# 开始构建镜像 -t 构建镜像的名称:镜像版本   . 表示当前目录
docker build -t test:v1 .


# 根据构建出的镜像创建运行容器
# -i 以交互模式运行容器，通常与 -t 同时使用
# -t 为容器重新分配一个伪输入终端，通常与 -i 同时使用
# -d 后台运行容器，并返回容器ID
# -p docker 容器内外端口映射
# --name 运行容器的名称
# 最后跟上容器镜像的名称
docker run -itd -p 9000:9000 --name test_hello test:v1

# 在浏览器使用 ip:9000 访问网站
在这里插入图片描述

3. Nodejs构建的网站的 docker 镜像创建

Nodejs构建的网站：例如 VUE 等

3.1 准备工作

需要提前准备以下两个内容：

  • Dockerfile 文件
  • vue 开发的网站目录中

将 Dockerfile 文件放到 vue 开发的网站目录中，如下图所示：

在这里插入图片描述

3.2 Dockerfile 文件内容

FROM node:12

# 复制代码
# 将当前目录所有文件复制到 docker 中的 /app 目录中
ADD . /app

# 设置容器启动后默认运行的目录为 /app
WORKDIR /app

# 运行命令，安装依赖
# RUN 命令可以有多个，可以使用 && 连接来减少层级
RUN npm install

# CMD 指令只能有一个，是容器启动后默认运行的命令，是程序的入口
CMD ["npm", "run", "serve"]

# 暴露端口，该端口是 npm run 运行暴露出的端口
EXPOSE 8080

3.3 构建 docker 镜像并运行 docker 容器

# 开始构建镜像 -t 构建镜像的名称:镜像版本   . 表示当前目录
docker build -t vue_test:v1 .


# 根据构建出的镜像创建运行容器
# -i 以交互模式运行容器，通常与 -t 同时使用
# -t 为容器重新分配一个伪输入终端，通常与 -i 同时使用
# -d 后台运行容器，并返回容器ID
# -p docker 容器内外端口映射
# --name 运行容器的名称
# 最后跟上容器镜像的名称
docker run -itd -p 8080:8080 --name vue_test_001 vue_test:v1

# 在浏览器使用 ip:8080 访问网站
在这里插入图片描述