Reworking docker-compose.prod.yaml to make it generic while still having a front container configurable

front/Dockerfile

@@ -1,29 +1,16 @@
-# protobuf build
-FROM node:14.15.4-buster-slim@sha256:cbae886186467bbfd274b82a234a1cdfbbd31201c2a6ee63a6893eefcf3c6e76 as builder
-WORKDIR /usr/src
-COPY messages .
+FROM thecodingmachine/workadventure-back-base:latest as builder
+WORKDIR /var/www/messages
+COPY --chown=docker:docker messages .
 RUN yarn install && yarn proto
 
-# webpack build
-FROM node:14.15.4-buster-slim@sha256:cbae886186467bbfd274b82a234a1cdfbbd31201c2a6ee63a6893eefcf3c6e76 as builder2
-WORKDIR /usr/src
-COPY front/yarn.lock front/package.json ./
+# we are rebuilding on each deploy to cope with the API_URL environment URL
+FROM thecodingmachine/nodejs:14-apache
+
+COPY --chown=docker:docker front .
+COPY --from=builder --chown=docker:docker /var/www/messages/generated /var/www/html/src/Messages/generated
 RUN yarn install
 
-COPY front .
-COPY --from=builder /usr/src/generated src/Messages/generated
 ENV NODE_ENV=production
-
-ARG BASE_DOMAIN=workadventure.localhost
-ARG API_URL=pusher.$BASE_DOMAIN
-ARG UPLOADER_URL=uploader.$BASE_DOMAIN
-ARG ADMIN_URL=admin.$BASE_DOMAIN
-
-RUN API_URL=$API_URL UPLOADER_URL=$UPLOADER_URL ADMIN_URL=$ADMIN_URL \
-    yarn run build
-
-# final production image
-FROM nginx:1.19.6-alpine@sha256:01747306a7247dbe928db991eab42e4002118bf636dd85b4ffea05dd907e5b66
-COPY front/nginx-vhost.conf /etc/nginx/conf.d/default.conf
-COPY front/templater.sh /docker-entrypoint.d/templater.sh
-COPY --from=builder2 /usr/src/dist /usr/share/nginx/html
+ENV STARTUP_COMMAND_0="./templater.sh"
+ENV STARTUP_COMMAND_1="yarn run build"
+ENV APACHE_DOCUMENT_ROOT=dist/

front/templater.sh

@@ -1,15 +1,15 @@
 #!/usr/bin/env bash
 set -x
 set -o nounset errexit
-template_file_index=/usr/share/nginx/html/index.html.tmpl
-generated_file_index=/usr/share/nginx/html/index.html
+template_file_index=dist/index.html.tmpl
+generated_file_index=dist/index.html
 tmp_trackcodefile=/tmp/trackcode
 
 # To inject tracking code, you have two choices:
 # 1) Template using the provided google analytics
 # 2) Insert with your own provided code, by overriding the ANALYTICS_CODE_PATH
 # The ANALYTICS_CODE_PATH is the location of a file inside the container
-ANALYTICS_CODE_PATH="${ANALYTICS_CODE_PATH:-/usr/share/nginx/html/ga.html.tmpl}"
+ANALYTICS_CODE_PATH="${ANALYTICS_CODE_PATH:-dist/ga.html.tmpl}"
 
 if [[ "${INSERT_ANALYTICS:-NO}" == "NO" ]]; then
     echo "" > "${tmp_trackcodefile}"

front/webpack.config.js

@@ -39,7 +39,16 @@ module.exports = {
     plugins: [
         new HtmlWebpackPlugin(
             {
-                template: './dist/index.html'
+                template: './dist/index.tmpl.html',
+                minify: {
+                    collapseWhitespace: true,
+                    keepClosingSlash: true,
+                    removeComments: false,
+                    removeRedundantAttributes: true,
+                    removeScriptTypeAttributes: true,
+                    removeStyleLinkTypeAttributes: true,
+                    useShortDoctype: true
+                }
             }
         ),
         new webpack.ProvidePlugin({