---
title: Docker
tags: docker
---

## Docker 包裝及使用
* 包裝 on Windows

> 建立 nginx-custom.conf (Nginx設定檔，含伺服器port)
> ```
> server {
> listen *:8080 ; # 指定port to serve
> location / {
> root /usr/share/nginx/html; # 指定web根目錄
> index index.html index.html; # 指定index為index.html
> # request uri如果沒有match的route，就回index.html
> try_files $uri $uri/ /index.html=404;
> }
> }
> ```
> 建立 dockerfile
> ```
> # 第一階段產生dist資料夾
> FROM node:alpine as builder
>
> # 指定預設/工作資料夾
> WORKDIR /app
>
> # 只copy package.json檔案
> COPY ./package*.json /app/
> # 安裝dependencies
> RUN npm install
> # 或使用 RUN yarn install
>
> # copy其餘目錄及檔案
> COPY ./ /app/
>
> # 指定建立build output資料夾，--prod為Production Mode
> RUN npm run build --output-path=./dist/tbfront-end --prod
> # (先測試Angular專案 build之後產出之資料夾名稱: tbfront-end)
>
> # pull nginx image
> FROM nginx:alpine
>
> # 從第一階段的檔案copy
> COPY --from=builder /app/dist/tbfront-end /usr/share/nginx/html
> # 對應前面Nginx設定檔的指定web根目錄 ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
> # 覆蓋image裡預設的Nginx設定檔
> COPY ./nginx-custom.conf /etc/nginx/conf.d/default.conf
> ```
> 建立.dockerignore (忽略清單)
> ```
> # 告訴docker不要把以下資料夾send到build context
> node_modules
> dist
> ```
> 建立Docker Image
> ```
> docker build -t [DockerHub account]/[Repo Name] .
> P.S. -t為 tagName參數(需為小寫) .為執行路徑 ( dockerfile 存放位置 )
> ex: docker build -t victor5giotlead/tbfrontend .
> ```
> 將產生的Image上傳至DockerHub
> ```
> docker push victor5giotlead/tbfrontend (DockerHub 帳號名稱 / Repository 名稱)
> ```
* 啟動伺服器 on Linux
> ```
> sudo docker pull victor5giotlead/tbfrontend
> sudo docker run -p 8080:8080 -d victor5giotlead/smartpolelite
> ```
> P.S. port與nginx-custom.conf裡設定一致
> -d containter背景執行 (Detached模式，或稱之為"Daemonized"的方式執行)

P.S. 全新Angular專案執行成功

錯誤:

=> ERROR [stage-1 2/3] COPY --from=builder /usr/app/dist/frontend /usr/share/nginx/html   

解決:

注意路徑，要與Angular專案build出來的資料夾名稱及上面預設工作區一致

## Docker image 匯出 & 匯入檔案

* 將 Docker image 匯出成檔案
`docker save imageName > filename.tar`

* 從檔案讀取 Docker image
`docker load --input filename.tar`

## Reference
>[Install Docker on Debian](https://docs.docker.com/engine/install/debian/)
>[Docker image 匯出 & 匯入檔案](https://peihsinsu.gitbooks.io/docker-note-book/content/docker-save-image.html)
>[Angular in Docker with Nginx](https://tiangolo.medium.com/angular-in-docker-with-nginx-supporting-environments-built-with-multi-stage-docker-builds-bb9f1724e984)
>[Anguler in Docker with Nginx (中文參考)](https://ithelp.ithome.com.tw/articles/10207731)