feat: create docker file and docker build CI (#24)

* Create Dockerfile

* Create docker-image.yml

* Fix https://github.com/YunYouJun/cook/issues/12

* Format docker-image.yml

* Update docker-image.yml with two steps

* Format fix in docker-image.yml

https://github.com/henryclw/cook/runs/6186682354

* Format fix in Dockerfile

* Use official CI/CD of GitHub docker action

https://docs.docker.com/language/nodejs/configure-ci-cd/

* Fix typo in docker-image.yml

* Add last line in docker-image.yml

* Update docker-image.yml, use docker/login-action@v1

* Revert "Update docker-image.yml, use docker/login-action@v1"

This reverts commit f15e007225.

* Let docker image tag be the same as the branch name

https://stackoverflow.com/questions/58033366/how-to-get-the-current-branch-within-github-actions

* Let docker image tag be the same as the branch name, use branch name ${GITHUB_REF#refs/heads/}

* Use docker/metadata-action in docker-image.yml

https://github.com/docker/metadata-action

* Fix image name in docker/metadata-action in docker-image.yml

* Use master branch of docker/metadata-action in docker-image.yml

* Update docker in README.md, pull or build locally

* Use the latest tag if it is the default branch

* Remove empty lines in docker-image.yml

* Update name in docker-image.yml

* Update docker instructions in README.md

Resolved:
- https://github.com/YunYouJun/cook/pull/24#discussion_r860803527
- https://github.com/YunYouJun/cook/pull/24#discussion_r860807487
- https://github.com/YunYouJun/cook/pull/24#discussion_r860807702

* chore: update docs description

* Update README.md

Co-authored-by: 云游君 <me@yunyoujun.cn>

.github/workflows/docker-image.yml

@@ -0,0 +1,45 @@
+name: Build and Publish Docker Image
+
+on:
+  push:
+    branches: [main]
+  pull_request:
+    branches: [main]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Check Out Repo
+        uses: actions/checkout@main
+      - name: Docker meta
+        id: meta
+        uses: docker/metadata-action@master
+        with:
+          images: ${{ secrets.DOCKER_HUB_USERNAME }}/cook
+          tags: |
+            type=ref,event=branch
+            type=ref,event=pr
+            type=semver,pattern={{version}}
+            type=semver,pattern={{major}}.{{minor}}
+            # set latest tag for default branch
+            type=raw,value=latest,enable={{is_default_branch}}
+      - name: Login to Docker Hub
+        uses: docker/login-action@master
+        with:
+          username: ${{ secrets.DOCKER_HUB_USERNAME }}
+          password: ${{ secrets.DOCKER_HUB_ACCESS_TOKEN }}
+      - name: Set up Docker Buildx
+        id: buildx
+        uses: docker/setup-buildx-action@master
+      - name: Build and push
+        id: docker_build
+        uses: docker/build-push-action@master
+        with:
+          context: ./
+          file: ./Dockerfile
+          push: ${{ github.event_name != 'pull_request' }}
+          tags: ${{ steps.meta.outputs.tags }}
+          labels: ${{ steps.meta.outputs.labels }}
+      - name: Image digest
+        run: echo ${{ steps.docker_build.outputs.digest }}

Dockerfile

@@ -0,0 +1,20 @@
+FROM node:lts-alpine
+
+RUN apk update
+RUN apk add xdg-utils
+
+RUN npm install -g pnpm
+
+WORKDIR /app
+
+COPY . .
+
+RUN pnpm install
+
+# convert csv to json
+# automatically executed when postinstall
+RUN pnpm convert
+
+EXPOSE 3333
+
+ENTRYPOINT ["pnpm", "dev"]

README.md

@@ -41,6 +41,28 @@ pnpm dev
 # http://localhost:3333
 ```
 
+## docker
+
+你可以选择从 Docker Hub 拉取最新的镜像，或本地自行构建。
+
+### 从 Docker Hub 拉取最新的镜像
+
+```bash
+# 从 Docker Hub 拉取最新的镜像
+docker pull yunyoujun/cook:latest
+# 启动容器，然后打开 http://localhost:3333
+docker run -it -d --name cook_dev -p 3333:3333 yunyoujun/cook:latest
+```
+
+### 自己本地构建
+
+```bash
+# 本地构建
+docker build . -t yourname/cook:localdev
+# 启动容器，然后打开 http://localhost:3333
+docker run -it -d --name cook_dev -p 3333:3333 yourname/cook:localdev
+```
+
 ## 致谢
 
 感谢以下小伙伴为本项目提供的数据支持和 QA ！

package.json

@@ -7,7 +7,7 @@
   "scripts": {
     "build": "npm run convert && vite-ssg build",
     "convert": "esno scripts/convert.ts",
-    "dev": "vite --port 3333 --open",
+    "dev": "vite --port 3333 --open --host",
     "lint": "eslint .",
     "postinstall": "npm run convert",
     "preview": "vite preview",