使用 Caddy 制做前端 Docker 镜像

简介

今年夏天又开始新的创业项目，忙得没日没夜，很久没写博客了。
可是也许 Docker 愈来愈火，知乎的专栏天天都有新的人关注，不抽空写点太对不起你们。
以前写过 API 镜像，今天来讲说前端镜像。
本文适用于任何一个须要编译的前端框架，咱们利用 Docker 的两段构建，用一个 Dockerfile 一鼓作气的产出不含源码的生产镜像。
镜像内用了 Caddy 看成服务器，又通过了半年的发展，虽然版本还没到1，但 Caddy 已经足够强大和健壮了。

Caddyfile

为了能让项目在 Caddy 镜像中被访问，咱们在项目根目录建一个叫 Caddyfile 的文件，供后续镜像内启动服务时使用。

0.0.0.0:80
root /www
gzip
log stdout
errors stdout复制代码

解释一下，咱们将来会把编译好的项目放在容器的 /www 目录。
服务器在容器的80端口。启用gzip，而且将日志输出在stdout--这是 Docker 的推荐作法。

Dockerfile

而后就开始咱们的二段构建了:

# build
FROM node:8 as builder

ADD . /src 
WORKDIR /src 
RUN npm i && npm run build 
# product
FROM abiosoft/caddy

COPY --from=builder /src/dist /www 
COPY Caddyfile /etc/Caddyfile复制代码

咱们首先使用 node 的官方镜像对项目进行编译，工做目录为 /src ，编译结果为 /src/dist 。
而后咱们再将 dist 文件夹复制为 caddy 镜像的 /www 目录。
最后咱们将咱们的 Caddyfile 覆盖镜像原版的。

值得一提的是，咱们使用的 abiosoft/caddy 这个镜像并不是官方版本，可是比较活跃，感兴趣也能够去看源码。

使用镜像

若是一台物理机只准备使用这一个镜像，那么咱们以前的 Caddyfile 不该该限定80端口，而且应该指定域名，以此来使用 Caddy 的自动 HTTPS 特性。
作了如此修改后将镜像启动时绑定80和443端口就好。

可是大部分时候，咱们只是让镜像的80端口映射在主机的某个端口，主机上还有一层 Web 服务器。就再也不罗嗦这里应该怎么配置了。