ci: publish docker image on release

.dockerignore

@@ -0,0 +1,3 @@
+node_modules
+dist
+.github

.github/workflows/release.yml

@@ -6,6 +6,10 @@ on:
     branches:
       - next
 
+env:
+  REGISTRY: ghcr.io
+  IMAGE_NAME: geostyler/geostyler-demo
+
 jobs:
   release:
     name: Release
@@ -31,3 +35,21 @@ jobs:
         env:
           GITHUB_TOKEN: ${{ secrets.GH_RELEASE_TOKEN }}
           NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
+
+      - name: Log in to the Container registry
+        if: steps.semantic.outputs.new_release_published == 'true'
+        uses: docker/login-action@3b8fed7e4b60203b2aa0ecc6c6d6d91d12c06760
+        with:
+          registry: ${{ env.REGISTRY }}
+          username: ${{ github.actor }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Build and push Docker image
+        if: steps.semantic.outputs.new_release_published == 'true'
+        uses: docker/build-push-action@4f58ea79222b3b9dc2c8bbdd6debcef730109a75
+        with:
+          context: .
+          push: true
+          tags: |
+            ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}:latest
+            ${{ env.REGISTRY }}/${{ env.IMAGE_NAME }}:${{ steps.semantic.outputs.new_release_version }}

Dockerfile

@@ -0,0 +1,19 @@
+FROM node:20-alpine3.21 AS builder
+
+WORKDIR /app
+
+COPY package.json package-lock.json ./
+
+RUN npm ci
+
+COPY . .
+
+RUN npm run build-docker
+
+############
+
+FROM nginx:1.27.4-alpine AS runner
+
+COPY --from=builder /app/dist /usr/share/nginx/html
+
+EXPOSE 80

package.json

@@ -26,7 +26,8 @@
   },
   "scripts": {
     "start": "vite",
-    "build": "vite build && copyfiles \"./public/**/*.png\" dist --up 1 && copyfiles \"./public/**/*.json\" dist --up 1"
+    "build": "vite build && copyfiles \"./public/**/*.png\" dist --up 1 && copyfiles \"./public/**/*.json\" dist --up 1",
+    "build-docker": "vite build --config vite.config.docker.ts && copyfiles \"./public/**/*.png\" dist --up 1 && copyfiles \"./public/**/*.json\" dist --up 1"
   },
   "eslintConfig": {
     "extends": "react-app"

vite.config.docker.ts

@@ -0,0 +1,23 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+import VitePluginMetaEnv from 'vite-plugin-meta-env';
+import packageLockJson from './package-lock.json';
+
+const metaEnv = {
+  GEOSTYLER_VERSION: packageLockJson.packages['node_modules/geostyler'].version
+};
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [
+    react(),
+    VitePluginMetaEnv(metaEnv, 'import.meta.env'),
+  ],
+  base: '/',
+  server: {
+    host: '0.0.0.0',
+  },
+  define: {
+    global: {},
+  },
+});