一、初探docker
那么docker是什么就不累述了，不了解的同学点击传送门
本文涵盖以下内容：
docker安装Dockerfile编写: Dockerfile是镜像构建的模版，描述镜像构建的步骤。docker-compose编写: compose是命令行工具，用于定义和运行多容器Docker应用程序的工具。
二、安装docker
以window11为例。参考文档：www.dockercn.net/?id=203
桌面右键-显示设置-应用-可选功能-更多Windows功能 选中“虚拟机平台”和“适用于Linux的Windows子系统”
确定后重启电脑。
然后按照文档下载安装即可。
下载地址：www.docker.com/products/do…
打开window命令窗口输入：docker version校验是否安装成功。
三、创建react项目
要求nodejs在14及以上版本，查看nodejs可安装版本命令：nvm list available
npx create-react-app docker-dome
yarn 初始化
yarn start运行项目
四、编写dockerfile
- Dockerfile配置如下：
# 告诉Docker抓取Node的一个副本
FROM node:14
# 使用WORKDIR命令为Docker容器设置工作目录。 声明工作目录后，任何CMD ， RUN ， ADD ， COPY命令都将在指定的工作目录中执行
WORKDIR /dockers
# 将package.json从我们的React项目复制到Docker容器中
COPY package.json ./
# 安装依赖项并将其余应用程序复制到Docker容器
COPY . .
RUN yarn && yarn build && npm install -g http-server
EXPOSE 80
# 运行开发脚本。 对于CRA， yarn run start要启动开发服务器
CMD http-server ./build -p 3000
运行命令：docker build -f ./Dockerfile -t docker-dome . 生成镜像，注意'. '后面要有空格。
查看镜像：docker images
在最右侧，可以看到images的大小。现在是1.43GB
4.1 第一次“减肥”
更改基础镜像，将alpine作为基础镜像，看看效果。
- 在之前的配置中，使用node:14作为基础镜像。但传统上，节点映像基于Ubuntu ，这对于简单的 React应用程序来说是不必要的繁重。
- 从 DockerHub（官方 docker 镜像注册表）可以看到，基于 alpine 的镜像比基于 ubuntu 的镜像小得多，并且它们被打包时仅具有最少的依赖量。
- Dockerfile配置如下：
# 告诉Docker抓取Node的一个副本，将alpine作为基础镜像。
FROM node:14-alpine
# 使用WORKDIR命令为Docker容器设置工作目录。 声明工作目录后，任何CMD ， RUN ， ADD ， COPY命令都将在指定的工作目录中执行
WORKDIR /dockers
# 将package.json从我们的React项目复制到Docker容器中
COPY package.json ./
# 安装依赖项并将其余应用程序复制到Docker容器
COPY . .
RUN yarn && yarn build && npm install -g http-server
EXPOSE 80
# 运行开发脚本。 对于CRA， yarn run start要启动开发服务器
CMD http-server ./build -p 3000
打包镜像，为了更优雅的操作，我们将打包镜像命令和运行镜像命令添加到package.json中：
"scripts": {
...
"docker": "docker build -f ./Dockerfile -t docker-dome . ",
"react-docker": "docker run docker-dome"
...
},
运行命令：yarn docker 查看镜像：docker images
哇！599MB！ 这对第一次生成的镜像来说有很大的“瘦身”，但这对生产上线包来讲还是太大了，再想想别的“减肥方案”。
4.2 第二次“瘦身”
多阶段构建 [多段构建官方文档：docs.docker.com/develop/dev…]
- 在之前的配置中，我们将所有源代码复制到工作目录中。
- 但这是不必要的，因为我们只需要构建文件夹来服务我们的网站。所以现在我们将使用多阶段构建的概念来减少我们最终镜像中不必要的代码和依赖项。
- Dockerfile配置如下：
# 告诉Docker抓取Node的一个副本，将alpine作为基础镜像，同时将该阶段定名为 builder，方便后面引用这个阶段。
FROM node:14-alpine AS builder
# 使用WORKDIR命令为Docker容器设置工作目录。 声明工作目录后，任何CMD ， RUN ， ADD ， COPY命令都将在指定的工作目录中执行
WORKDIR dockers
# 将package.json从我们的React项目复制到Docker容器中
COPY package.json ./
# 安装依赖项
RUN yarn
# 将当前目录下的所有文件（除了.dockerignore排除的路径），都拷贝进入镜像的工作目录下并打包启动
COPY . ./
RUN yarn build
# 最后一级构建
FROM node:14-alpine
RUN npm i -g http-server
# 复制第一阶段构建内容
COPY --from=builder /dockers/build /build
# 暴露端口
EXPOSE 80
# 运行开发脚本
CMD http-server ./build -p 3000
查看镜像：docker images
125MB！ 又是有效的“瘦身运动”。不过还是大，再看看。
4.3 第三次“刮骨”
使用nginx
- 尝试使用Nginx这样更高效、更轻量级的服务器来构建镜像。
- 最终的Dockerfile配置如下：
# 告诉Docker抓取Node的一个副本，将alpine作为基础镜像，同时将该阶段定名为 builder，方便后面引用这个阶段。
FROM node:14-alpine AS builder
# 使用WORKDIR命令为Docker容器设置工作目录。 声明工作目录后，任何CMD ， RUN ， ADD ， COPY命令都将在指定的工作目录中执行
WORKDIR /dockers
# 将package.json 从我们的React项目复制到Docker容器中
COPY package.json ./
# 安装依赖项
RUN yarn
# 将当前目录下的所有文件（除了.dockerignore排除的路径），都拷贝进入镜像的工作目录下并打包启动
COPY . .
RUN yarn build
# 最后一级构建
FROM nginx:stable-alpine
COPY --from=builder /dockers/build /usr/share/nginx/html
# 暴露端口
EXPOSE 80
# 运行开发脚本
CMD ["nginx", "-g", "daemon off;"]
查看镜像：docker images
23.7MB！
对此，镜像瘦身就告一段落~
五、docker-compose文件编写
Compose 使用的三个步骤：
- 使用 Dockerfile 定义应用程序的环境。
- 使用 docker-compose.yml 定义构成应用程序的服务，这样它们可以在隔离环境中一起运行。
- 最后，执行 docker-compose up 命令来启动并运行整个应用程序。
docker-compose.yml配置详情：
# compose是将所有docker命令和服务链接在一起的有用工具
# 将端口3000映射到Docker
version: '3.8' # 指定docker-compose文件的版本，必写
services: # 一个应用的容器，实际上可以包括若干运行相同镜像的容器实例，必写
dome: # 镜像名称或镜像ID。如果镜像在本地不存在，compose将会尝试拉取这个镜像。
build:
context: . # 指定dockerfile的上下文目录
dockerfile: Dockerfile # 指定dockerfile
ports: # 对外暴露的端口
- '3000:80'
volumes: # 用来指定宿主机目录和容器目录映射，可用于挂载配置文件，data等
- '/dockers/node_modules'
- './:/dockers'
# restart: always # 容器总是重新启动
# container_name: docker_name # 容器名
# command: command # 容器执行什么命令
# environment: # 添加环境变量
# - name=value
# networks: # 设置网络连接模式，相当于docker run --network
# - networkName
docker-compose常用的命令：
-
docker-compose start：启动已经存在的服务容器 -
docker-compose stop： 停止正在运行的容器 -
docker-compose -h： 查看帮助 -
docker-compose logs： 查看服务容器的输出 -
docker-compose build： 构建（重新构建）项目中的服务容器 -
docker-compose restart： 重启项目中的服务 -
docker-compose rm： 删除所有（停止状态的）服务容器 -
docker-compose pull： 拉取服务依赖的镜像 -
docker-compose push： 推送服务依赖的镜像
