diyfr · June 3, 2021 13:40 · Jun 3, 2021 · Jun 3, 2021 · Jun 3, 2021 · Jun 3, 2021
diff --git a/Dockerfile b/Dockerfile
@@ -3,7 +3,7 @@ FROM node:slim AS build
 
 COPY . /app
 WORKDIR /app
-RUN npm ci && npx ng build --prod --base-href='\${BASE_URL}'
+RUN npm run ng build -- --prod --base-href='\${BASE_URL}'
 
 # RUN
 FROM nginx:alpine AS run

diff --git a/Dockerfile b/Dockerfile
@@ -3,7 +3,7 @@ FROM node:slim AS build
 
 COPY . /app
 WORKDIR /app
-RUN npm ci && npx ng build --prod --base-href '\${BASE_URL}'
+RUN npm ci && npx ng build --prod --base-href='\${BASE_URL}'
 
 # RUN
 FROM nginx:alpine AS run

diff --git a/readme.MD b/readme.MD
@@ -1,4 +1,5 @@
 ### Multistage Docker sur un projet Angular  
+Fichiers utilisés : `Dockerfile`  et `docker-entrypoint.sh`  
 Le build docker va injecter ${BASE_URL} en base href dans le index.html  
 
 ### Récupérer valeurs d'environnement dans l'application. Ajout d'un service angular.

diff --git a/Dockerfile b/Dockerfile
@@ -0,0 +1,22 @@
+# BUILD
+FROM node:slim AS build
+
+COPY . /app
+WORKDIR /app
+RUN npm ci && npx ng build --prod --base-href '\${BASE_URL}'
+
+# RUN
+FROM nginx:alpine AS run
+
+COPY ./docker/docker-entrypoint.sh /usr/bin/
+COPY ./docker/nginx.front.conf /etc/nginx/conf.d/default.conf
+COPY --from=build /app/dist/my-app /usr/share/nginx/html
+
+EXPOSE 80
+ENV PORT=80
+ENV BASE_URL=/
+ENV VAL1=maVal1
+ENV VAL2=maVal2
+
+ENTRYPOINT ["/usr/bin/docker-entrypoint.sh"]
+CMD ["nginx", "-g", "daemon off;"]
diff --git a/config.js.tpl b/config.js.tpl
@@ -0,0 +1,8 @@
+(function (window) {
+  const config = {
+    baseUrl: '${BASE_URL}',
+    val1: '${VAL1}',
+    val2: '${VAL2}'
+  }
+  window.config = window.config || config
+})(this)
diff --git a/config.service.ts b/config.service.ts
@@ -0,0 +1,16 @@
+@Injectable()
+export class ConfigService implements Configuration {
+  baseUrl: string
+  val1: string
+  val2: string
+
+  constructor () {
+    const browserWindow = window || {}
+    const browserWindowConfig = browserWindow['config'] || {}
+    for (const key in browserWindowConfig) {
+      if (browserWindowConfig.hasOwnProperty(key)) {
+        this[key] = browserWindowConfig[key]
+      }
+    }
+  }
+}
diff --git a/docker-entrypoint.sh b/docker-entrypoint.sh
@@ -0,0 +1,20 @@
+#!/bin/sh
+set -e
+
+INDEX_PATH=/usr/share/nginx/html/index.html
+TEMP_INDEX=$(mktemp)
+# Remplace les valeurs d'environnements existantes dans index.html et place le résultat dans un fichier temporaire
+envsubst < ${INDEX_PATH} > ${TEMP_INDEX}
+# Remplace le fichier index.html par le fichier temporaire
+mv ${TEMP_INDEX} ${INDEX_PATH}
+chmod a+r ${INDEX_PATH}
+
+# Option 2 récuperer les valeurs environnement dans l'appli
+CONFIG_PATH=/usr/share/nginx/html/assets/config.js
+CONFIG_TEMPLATE_PATH=/usr/share/nginx/html/assets/config.js.tpl
+if test -f ${CONFIG_TEMPLATE_PATH}; then
+  envsubst < ${CONFIG_TEMPLATE_PATH} > ${CONFIG_PATH}
+fi
+# -> Fin option 2
+
+exec "$@"
diff --git a/readme.MD b/readme.MD
@@ -0,0 +1,15 @@
+### Multistage Docker sur un projet Angular  
+Le build docker va injecter ${BASE_URL} en base href dans le index.html  
+
+### Récupérer valeurs d'environnement dans l'application. Ajout d'un service angular.
+Dans le Header du fichier `index.html`  ajouter  
+```html
+    <script type="text/javascript" src="assets/config.js"></script>
+```
+`config.js.tpl` à placer dans assets/config
+`config.js` injecte les variables 
+
+`config.service` Récupère les variables injectées  
+
+
+