From 8f4800c9c569fd133153d9f487f2ff23b1f4f8e2 Mon Sep 17 00:00:00 2001 From: Chen Wang Date: Mon, 19 Aug 2024 14:25:00 -0500 Subject: [PATCH] try another pattern --- frontend/Dockerfile | 29 +++++++++++++++-------------- frontend/clowder.conf.template | 16 ++++------------ frontend/src/index.ejs | 2 +- frontend/webpack.config.prod.js | 8 +------- 4 files changed, 21 insertions(+), 34 deletions(-) diff --git a/frontend/Dockerfile b/frontend/Dockerfile index b372eea66..729b6b0b8 100644 --- a/frontend/Dockerfile +++ b/frontend/Dockerfile @@ -5,10 +5,11 @@ FROM node:16.15.1 AS clowder-build WORKDIR /usr/src/app -ARG BASE_URL_ROUTE -ENV BASE_URL_ROUTE=${BASE_URL_ROUTE:-/} -RUN BASE_URL_ROUTE=${BASE_URL_ROUTE%/} && BASE_URL_ROUTE=${BASE_URL_ROUTE#/} && BASE_URL_ROUTE=/${BASE_URL_ROUTE} -RUN echo "BASE_URL_ROUTE: ${BASE_URL_ROUTE}" +# Define the argument and environment variable +# Make sure BASE_URL_ROUTE starts with a slash and does not end with a slash +ARG BASE_URL_ROUTE="" +ENV BASE_URL_ROUTE=${BASE_URL_ROUTE:-} +RUN echo "Build time BASE_URL_ROUTE: ${BASE_URL_ROUTE}" # copy only package for caching purposes COPY ["package.json", "package-lock.json*", "./"] @@ -28,21 +29,21 @@ RUN npm run build FROM nginx:alpine as clowder-runtime -# Set the environment variable with a default value if not provided -ARG BASE_URL_ROUTE -ENV BASE_URL_ROUTE=${BASE_URL_ROUTE:-/} -RUN BASE_URL_ROUTE=${BASE_URL_ROUTE%/} && BASE_URL_ROUTE=${BASE_URL_ROUTE#/} && BASE_URL_ROUTE=/${BASE_URL_ROUTE} -RUN echo "BASE_URL_ROUTE: ${BASE_URL_ROUTE}" +# Define the argument and environment variable +# Make sure BASE_URL_ROUTE starts with a slash and does not end with a slash +ARG BASE_URL_ROUTE="" +ENV BASE_URL_ROUTE=${BASE_URL_ROUTE:-} +RUN echo "Runtime BASE_URL_ROUTE: ${BASE_URL_ROUTE}" # Adjust the paths based on BASE_URL_ROUTE RUN rm -rf /usr/share/nginx/html/ && \ - mkdir -p /usr/share/nginx/html${BASE_URL_ROUTE}/public && \ - mkdir -p /usr/share/nginx/html${BASE_URL_ROUTE}/styles + mkdir -p /usr/share/nginx/html/${BASE_URL_ROUTE}/public && \ + mkdir -p /usr/share/nginx/html/${BASE_URL_ROUTE}/styles # Copy the built application from the previous stage -COPY --from=clowder-build /usr/src/app/dist/ /usr/share/nginx/html${BASE_URL_ROUTE}/ -COPY src/public /usr/share/nginx/html${BASE_URL_ROUTE}/public/ -COPY src/styles /usr/share/nginx/html${BASE_URL_ROUTE}/styles/ +COPY --from=clowder-build /usr/src/app/dist/ /usr/share/nginx/html/${BASE_URL_ROUTE} +COPY src/public /usr/share/nginx/html/${BASE_URL_ROUTE}/public/ +COPY src/styles /usr/share/nginx/html/${BASE_URL_ROUTE}/styles/ # Copy the NGINX configuration template COPY clowder.conf.template /etc/nginx/conf.d/default.conf.template diff --git a/frontend/clowder.conf.template b/frontend/clowder.conf.template index bc430bcc3..670e43995 100644 --- a/frontend/clowder.conf.template +++ b/frontend/clowder.conf.template @@ -3,18 +3,10 @@ server { root /usr/share/nginx/html; - location ${BASE_URL_ROUTE}/ { - root /usr/share/nginx/html/; - index index.html; - try_files $uri $uri/ ${BASE_URL_ROUTE}/index.html; - } - - location ${BASE_URL_ROUTE}/public/ { - root /usr/share/nginx/html${BASE_URL_ROUTE}; - } - - location ${BASE_URL_ROUTE}/style/ { - root /usr/share/nginx/html${BASE_URL_ROUTE}; + location / { + root /usr/share/nginx/html; + index index.html index.htm; + try_files $uri ${BASE_URL_ROUTE}/index.html; } error_page 500 502 503 504 /50x.html; diff --git a/frontend/src/index.ejs b/frontend/src/index.ejs index 9c16eb0d5..5bfebe72f 100644 --- a/frontend/src/index.ejs +++ b/frontend/src/index.ejs @@ -26,7 +26,7 @@ rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap" /> - + Clowder v2 diff --git a/frontend/webpack.config.prod.js b/frontend/webpack.config.prod.js index 8d6ad237d..fcdee8db0 100644 --- a/frontend/webpack.config.prod.js +++ b/frontend/webpack.config.prod.js @@ -35,9 +35,6 @@ export default { filename: "[name].bundle.js", chunkFilename: "[name].chunk.bundle.js", path: path.resolve(__dirname, "dist"), - publicPath: process.env.BASE_URL_ROUTE - ? `${process.env.BASE_URL_ROUTE}/` - : "/", // Ensure trailing slash }, plugins: [ // NOTE: `npm run preinstall` currently runs eslint @@ -68,7 +65,7 @@ export default { // Generate HTML file that contains references to generated bundles. See here for how this works: https://github.com/ampedandwired/html-webpack-plugin#basic-usage new HtmlWebpackPlugin({ template: "src/index.ejs", - favicon: "./src/public/favicon.ico", + favicon: `src/public/favicon.ico`, minify: { removeComments: true, collapseWhitespace: true, @@ -85,9 +82,6 @@ export default { // Note that you can add custom options here if you need to handle other custom logic in index.html // To track JavaScript errors via TrackJS, sign up for a free trial at TrackJS.com and enter your token below. trackJSToken: "", - publicPath: process.env.BASE_URL_ROUTE - ? `${process.env.BASE_URL_ROUTE}/` - : "/", // Ensure trailing slash }), new webpack.LoaderOptionsPlugin({