Optimize Frontend Docker Image

docker-compose.dev.yml

@@ -32,10 +32,9 @@ services:
     - DEBUG=1
     build:
       context: ./frontend
-      dockerfile: Dockerfile
+      dockerfile: Dockerfile.dev
     volumes:
       - ${codedir}/librephotos-frontend:/usr/src/app
-      - ./frontend/entrypoint.sh:/entrypoint.sh
 
   backend:
     tty: true

frontend/Dockerfile

-FROM node:13-slim
+FROM node:13-slim as builder
 
-RUN apt-get update && apt-get install -y curl git xsel
+RUN apt-get update && apt-get install -y git
 
 RUN mkdir -p /usr/src/app
 WORKDIR /usr/src/app
-RUN npm install -g serve
 ENV CLI_WIDTH 80
 RUN git clone https://github.com/LibrePhotos/librephotos-frontend /usr/src/app
 RUN npm install --legacy-peer-deps
 RUN npm run build
 
+FROM halverneus/static-file-server
+ENV PORT 3000
 EXPOSE 3000
-COPY entrypoint.sh /entrypoint.sh
-CMD ["/entrypoint.sh"]
+
+COPY --from=builder /usr/src/app/build /web
+
+ENTRYPOINT ["/serve"]
+CMD []
\ No newline at end of file

frontend/Dockerfile.dev

+FROM node:13-slim
+
+# RUN apt-get update && apt-get install -y curl git xsel
+
+# RUN mkdir -p /usr/src/app
+WORKDIR /usr/src/app
+# RUN npm install -g serve
+# ENV CLI_WIDTH 80
+# RUN git clone https://github.com/LibrePhotos/librephotos-frontend /usr/src/app
+# RUN npm install --legacy-peer-deps
+# RUN npm run build
+
+EXPOSE 3000
+COPY entrypoint.sh /entrypoint.sh
+CMD ["/entrypoint.sh"]

frontend/entrypoint.sh

@@ -2,14 +2,6 @@
 
 echo "installing frontend"
 npm install --legacy-peer-deps
+npm run start
 
-echo "serving frontend"
-if [ "$DEBUG" = 1 ]
-then
-    echo "develompent running frontend"
-    npm run start
-else
-    echo "productions running frontend"
-    serve build -d -l 3000
-fi
 # DANGEROUSLY_DISABLE_HOST_CHECK=true HOST=0.0.0.0 npm start