Staged Docker builds for dev and prod

backend/Dockerfile

@@ -1,5 +1,5 @@
 # pull official node image
-FROM node
+FROM node AS dev
 
 # define /app as working directory
 WORKDIR /app
@@ -13,4 +13,10 @@ RUN npm install
 COPY . /app
 
 # launch node server
+ENTRYPOINT npm run dev
+
+# production
+FROM node AS prod
+WORKDIR /app
+COPY --from=dev /app ./
 ENTRYPOINT npm run start

backend/package.json

@@ -5,8 +5,8 @@
   "main": "server.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "start": "nodemon server.js -e ejs,js,css,html,jpg,png,scss",
-    "build": "cd frontend && npm install && npm run build"
+    "dev": "nodemon server.js -e ejs,js,css,html,jpg,png,scss",
+    "prod": "node.js server.js"
   },
   "keywords": [],
   "author": "",

frontend/Dockerfile

@@ -1,9 +1,22 @@
-FROM node:16-alpine
+FROM node AS dev
 
 WORKDIR /app
 EXPOSE 8080
-CMD ["npm", "run", "dev"]
 
 COPY package* ./
 RUN npm install
 COPY . .
+
+ENTRYPOINT ["npm", "run", "dev"]
+
+# builder
+FROM dev AS builder
+RUN npm run build
+
+# serve
+FROM nginx AS prod
+WORKDIR /usr/share/nginx/html
+RUN rm -rf ./*
+COPY ./nginx.conf /etc/nginx/conf.d/default.conf
+COPY --from=builder /app/dist .
+ENTRYPOINT ["nginx", "-g", "daemon off;"]

frontend/nginx.conf

@@ -0,0 +1,9 @@
+server {
+    listen       8080;
+    server_name  _;
+
+    location / {
+        root   /usr/share/nginx/html;
+        index  index.html index.htm;
+    }
+}

skaffold.yaml

@@ -30,8 +30,7 @@ profiles:
         - image: harbor.k-space.ee/playground/log-viewer-backend
           context: backend
           docker:
-            buildArgs:
-              ENV: development
+            target: dev
           sync:
             manual:
               - src: '**/*.js'
@@ -39,8 +38,7 @@ profiles:
         - image: harbor.k-space.ee/playground/log-viewer-frontend
           context: frontend
           docker:
-            buildArgs:
-              ENV: development
+            target: dev
           sync:
             manual:
               - src: 'src/**/*.vue'