你不知道的前端部署1：docker

1. Docker 介绍

Docker 是一个开源的应用容器引擎，让开发者可以打包他们的应用以及依赖包到一个可移植的容器中，然后发布到任何流行的 Linux 或 Windows 机器上，也可以实现虚拟化。容器是完全使用沙箱机制，相互之间不会有任何接口。

1.1 Docker 的优势

• 更高效的利用系统资源：与传统的虚拟机技术相比，Docker 对系统资源的利用率更高。因为容器直接运行在宿主机的内核，不需要像虚拟机那样在宿主机上运行一个完整的操作系统。
• 更快速的启动时间：Docker 容器无需启动完整的操作系统，因此可以在几秒钟内完成启动。
• 一致的运行环境：Docker 可以在构建时打包应用及其依赖，使得应用在任何地方都能一致地运行。
• 替代虚拟机（VM）：Docker 可以在很多情况下替代虚拟机。如果用户只关心应用程序而不是操作系统，可以用 Docker 替代虚拟机，把操作系统交给其他人去考虑。Docker 不仅启动速度比虚拟机快，迁移时也更为轻量，同时得益于它的分层文件系统，与其他人共享变更时更简单、更快捷。
• 软件原型：如果想快速体验软件，同时避免干扰目前的设置或配备一台虚拟机带来的麻烦，Docker 可以在几毫秒内提供一个沙盒环境。
• 打包软件：因为对 Linux 用户而言，Docker 镜像实际上没有依赖，所以非常适合用于打包软件。用户可以构建镜像，并确保它可以运行在任何现代 Linux 机器上。
• 让微服务架构：Docker 有助于将一个复杂系统分解成一系列可组合的部分，这让用户可以用更离散的方式来思考其服务。
• 网络建模：由于可以在一台机器上启动数百个（甚至数千个）相互隔离的容器，因此对网络进行建模轻而易举。
• 离线时启用全栈生产力：因为可以将系统的所有部分捆绑在 Docker 容器中，所以用户可以将其编排运行在笔记本电脑中移动办公，即便在离线时也毫无问题。
• 降低调试支出：Docker 让用户可以清晰地说明在一个属性已知的系统上调试问题的步骤，错误和环境重现变得更简单，而且通常与所提供的宿主机环境是分离的。
• 文档化软件依赖及接触点：通过使用结构化方式构建镜像，为迁移到不同环境做好准备，Docker 强制用户从一个基本出发点开始明确地记录软件依赖。
• 启用持续交付：Docker 可以确保从开发到生产的环境一致性来解决这个问题。Docker 在容器内部维护所有配置和依赖关系。因此，你可以从开发到生产使用相同的容器，确保没有环境之间的差异或人工干预。

2. Docker 常用命令行分析

Docker 提供了一套完整的命令行界面（CLI）来管理生命周期和操作容器。以下是一些常用的 Docker 命令：

• docker run：创建一个新的容器并运行一个命令。
• docker start：启动一个或多个已经被停止的容器。
• docker stop：停止一个运行中的容器。
• docker build：从 Dockerfile 构建一个新的镜像。
• docker pull：从镜像仓库拉取镜像。
• docker push：将镜像推送到镜像仓库。
• docker tag：将镜像打标签，常用版本号标签，如：node:20.10.0 。
• docker export：将文件系统作为一个 tar 归档文件导出到 STDOUT。
• docker image: 查看当前系统上的docker镜像列表
• docker ps: 查看当前系统上的dcoker容器，包括运行和已停止的容器。
• docker exec: 查看或修改容器中的文件、运行一些测试或调试工具、启动一个交互式的shell等。

3. Docker 实战1：前端静态服务器

下面我们将通过 Docker 来运行一个 Nginx 服务器。首先，我们需要从 Docker Hub 上拉取 Nginx 的官方镜像：

docker pull nginx

然后，我们可以运行一个 Nginx 容器：

docker run --name my-nginx -p 8080:80 -d nginx

以上命令会启动一个名为 my-nginx 的容器，并将容器的 80 端口映射到宿主机的 8080 端口。 现在，你可以通过浏览器访问 http://localhost:8080 来查看 Nginx 的欢迎页面了。

当然作为一个前端应用以上docker命令是不够用的，需要从npm run build后的产物dist目录（也可以是自定义目录）开始打包Nginx镜像，dockerfile文件内容如下：

# 基于官方的nginx镜像
FROM nginx
# 将本地的静态网页文件复制到镜像的/usr/share/nginx/html目录下
COPY /dist /usr/share/nginx/html
# 暴露80端口
EXPOSE 80

上述 Dockerfile 中的指令说明如下：

• FROM nginx：使用官方的 Nginx 镜像作为基础镜像。
• COPY nginx.conf /etc/nginx/nginx.conf：将我们自己编写的 Nginx 配置文件复制到容器中的 /etc/nginx/nginx.conf 路径。
• COPY /dist /usr/share/nginx/html：将应用程序的静态文件复制到容器中的 /usr/share/nginx/html 目录。
• EXPOSE 80：暴露容器的 80 端口，允许外部通过该端口访问 Nginx。

构建镜像命令如下：

docker build -t yourname:version -f ./dockerfile .

然后就可以将这个镜像推送到私库交给运维人员进行部署，推送私库命名如下：

# 登录私库
docker login '域名'
# 按提示输入用户名、密码后登录成功，登录成功才能推送私库
docker push yourname:version

4. Docker 实战2：eggjs服务器

上面写了如何通过nginx基础镜像打包一个前端应用镜像，并推送私库，那类似eggjs的后端应用如何通过docker打包部署呢？其实eggjs官方推荐了一个dockerfile文件，但是文件内容比较陈旧，经过更新的文件内容如下：

FROM node:18-alpine

ENV TIME_ZONE=Asia/Shanghai

RUN \
  mkdir -p /usr/src/app \
  && apk add --no-cache tzdata \
  && echo "${TIME_ZONE}" > /etc/timezone \ 
  && ln -sf /usr/share/zoneinfo/${TIME_ZONE} /etc/localtime 

WORKDIR /usr/src/app

COPY package.json /usr/src/app/

RUN npm i

COPY . /usr/src/app

EXPOSE 7001

CMD npm run start

有了dockerfile文件就可以通过docekr build打包出镜像镜像部署了，具体打包命令可以参考上一节命令

5. 总结

总的来说，使用Docker部署前端应用可以提高开发效率，简化部署流程，确保应用的一致性和可移植性，使得应用的管理和扩展更加容易。上文演示了使用docker部署前端应用和后端应用的常用命令，dockerfile文件等，相信聪明的小伙伴应该可以举一反三，对于不懂得命令参数也可以网上搜索，或者评论区留下你的问题。