簡介
今年夏天又開始新的創(chuàng)業(yè)項目倍阐,忙得沒日沒夜,好久沒寫博客了暑诸。
但是也許 Docker 越來越火蚌讼,知乎的專欄每天都有新的人關注,不抽空寫點太對不起大家个榕。
之前寫過 API 鏡像篡石,今天來說說前端鏡像。
本文適用于任何一個需要編譯的前端框架西采,我們利用 Docker 的兩段構建凰萨,用一個 Dockerfile 一氣呵成的產出不含源碼的生產鏡像。
鏡像內用了 Caddy 當作服務器械馆,又經過了半年的發(fā)展胖眷,雖然版本還沒到1,但 Caddy 已經足夠強大和健壯了霹崎。
Caddyfile
為了能讓項目在 Caddy 鏡像中被訪問珊搀,我們在項目根目錄建一個叫 Caddyfile 的文件,供后續(xù)鏡像內啟動服務時使用尾菇。
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 服務器孵奶。就不再羅嗦這里應該怎么配置了。