Add new build-webapp command and related scripts and containers. (#626)

* Add new build-webapp command and related scripts and containers.
2023-11-07 18:15:04 -06:00
parent 4456e70c93
commit 660326f713
13 changed files with 506 additions and 52 deletions
@@ -0,0 +1,55 @@
+# Originally from: https://github.com/devcontainers/images/blob/main/src/javascript-node/.devcontainer/Dockerfile
+# [Choice] Node.js version (use -bullseye variants on local arm64/Apple Silicon): 18, 16, 14, 18-bullseye, 16-bullseye, 14-bullseye, 18-buster, 16-buster, 14-buster
+ARG VARIANT=18-bullseye
+FROM node:${VARIANT}
+
+ARG USERNAME=node
+ARG NPM_GLOBAL=/usr/local/share/npm-global
+
+# Add NPM global to PATH.
+ENV PATH=${NPM_GLOBAL}/bin:${PATH}
+# Prevents npm from printing version warnings
+ENV NPM_CONFIG_UPDATE_NOTIFIER=false
+
+RUN \
+    # Configure global npm install location, use group to adapt to UID/GID changes
+    if ! cat /etc/group | grep -e "^npm:" > /dev/null 2>&1; then groupadd -r npm; fi \
+    && usermod -a -G npm ${USERNAME} \
+    && umask 0002 \
+    && mkdir -p ${NPM_GLOBAL} \
+    && touch /usr/local/etc/npmrc \
+    && chown ${USERNAME}:npm ${NPM_GLOBAL} /usr/local/etc/npmrc \
+    && chmod g+s ${NPM_GLOBAL} \
+    && npm config -g set prefix ${NPM_GLOBAL} \
+    && su ${USERNAME} -c "npm config -g set prefix ${NPM_GLOBAL}" \
+    # Install eslint
+    && su ${USERNAME} -c "umask 0002 && npm install -g eslint" \
+    && npm cache clean --force > /dev/null 2>&1
+
+# [Optional] Uncomment this section to install additional OS packages.
+RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
+    && apt-get -y install --no-install-recommends jq gettext-base
+
+# [Optional] Uncomment if you want to install an additional version of node using nvm
+# ARG EXTRA_NODE_VERSION=10
+# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"
+
+# We do this to get a yq binary from the published container, for the correct architecture we're building here
+# COPY --from=docker.io/mikefarah/yq:latest /usr/bin/yq /usr/local/bin/yq
+
+COPY /scripts /scripts
+
+# [Optional] Uncomment if you want to install more global node modules
+# RUN su node -c "npm install -g <your-package-list-here>"
+
+# RUN mkdir -p /config
+# COPY ./config.yml /config
+
+# Install simple web server for now (use nginx perhaps later)
+# RUN yarn global add http-server
+
+# Expose port for http
+EXPOSE 3000
+
+# Default command sleeps forever so docker doesn't kill it
+CMD ["/scripts/start-serving-app.sh"]
@@ -0,0 +1,5 @@
+FROM cerc/nextjs-base:local
+WORKDIR /app
+COPY . .
+RUN rm -rf node_modules build .next*
+RUN /scripts/build-app.sh /app
@@ -0,0 +1,13 @@
+#!/usr/bin/env bash
+# Build cerc/laconic-registry-cli
+
+source ${CERC_CONTAINER_BASE_DIR}/build-base.sh
+
+# See: https://stackoverflow.com/a/246128/1701505
+SCRIPT_DIR=$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )
+
+CERC_CONTAINER_BUILD_WORK_DIR=${CERC_CONTAINER_BUILD_WORK_DIR:-$SCRIPT_DIR}
+CERC_CONTAINER_BUILD_DOCKERFILE=${CERC_CONTAINER_BUILD_DOCKERFILE:-$SCRIPT_DIR/Dockerfile}
+CERC_CONTAINER_BUILD_TAG=${CERC_CONTAINER_BUILD_TAG:-cerc/nextjs-base:local}
+
+docker build -t $CERC_CONTAINER_BUILD_TAG ${build_command_args} -f $CERC_CONTAINER_BUILD_DOCKERFILE $CERC_CONTAINER_BUILD_WORK_DIR
@@ -0,0 +1,36 @@
+#!/bin/bash
+
+if [ -n "$CERC_SCRIPT_DEBUG" ]; then
+    set -x
+fi
+
+WORK_DIR="${1:-./}"
+SRC_DIR="${2:-.next}"
+TRG_DIR="${3:-.next-r}"
+
+cd "${WORK_DIR}" || exit 1
+
+rm -rf "$TRG_DIR"
+mkdir -p "$TRG_DIR"
+cp -rp "$SRC_DIR" "$TRG_DIR/"
+
+if [ -f ".env" ]; then
+  TMP_ENV=`mktemp`
+  declare -px > $TMP_ENV
+  set -a
+  source .env
+  source $TMP_ENV
+  set +a
+  rm -f $TMP_ENV
+fi
+
+for f in $(find "$TRG_DIR" -regex ".*.[tj]sx?$" -type f | grep -v 'node_modules'); do
+  for e in $(cat "${f}" | tr -s '[:blank:]' '\n' | tr -s '[{},()]' '\n' | egrep -o '^"CERC_RUNTIME_ENV[^\"]+"$'); do
+    orig_name=$(echo -n "${e}" | sed 's/"//g')
+    cur_name=$(echo -n "${orig_name}" | sed 's/CERC_RUNTIME_ENV_//g')
+    cur_val=$(echo -n "\$${cur_name}" | envsubst)
+    esc_val=$(sed 's/[&/\]/\\&/g' <<< "$cur_val")
+    echo "$cur_name=$cur_val"
+    sed -i "s/$orig_name/$esc_val/g" $f
+  done
+done
@@ -0,0 +1,63 @@
+#!/bin/bash
+
+if [ -n "$CERC_SCRIPT_DEBUG" ]; then
+    set -x
+fi
+
+SCRIPT_DIR=$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )
+
+WORK_DIR="${1:-/app}"
+
+cd "${WORK_DIR}" || exit 1
+
+cp next.config.js next.config.dist
+
+npm i -g js-beautify
+js-beautify next.config.dist > next.config.js
+
+npm install
+
+CONFIG_LINES=$(wc -l next.config.js | awk '{ print $1 }')
+MOD_EXPORTS_LINE=$(grep -n 'module.exports' next.config.js | cut -d':' -f1)
+
+head -$(( ${MOD_EXPORTS_LINE} - 1 )) next.config.js > next.config.js.1
+
+cat > next.config.js.2 <<EOF
+const webpack = require('webpack');
+
+let envMap;
+try {
+  // .env-list.json provides us a list of identifiers which should be replaced at runtime.
+  envMap = require('./.env-list.json').reduce((a, v) => {
+    a[v] = \`"CERC_RUNTIME_ENV_\${v.split(/\./).pop()}"\`;
+    return a;
+  }, {});
+} catch {
+  // If .env-list.json cannot be loaded, we are probably running in dev mode, so use process.env instead.
+  envMap = Object.keys(process.env).reduce((a, v) => {
+    if (v.startsWith('CERC_')) {
+      a[\`process.env.\${v}\`] = JSON.stringify(process.env[v]);
+    }
+    return a;
+  }, {});
+}
+EOF
+
+grep 'module.exports' next.config.js > next.config.js.3
+
+cat > next.config.js.4 <<EOF
+  webpack: (config) => {
+    config.plugins.push(new webpack.DefinePlugin(envMap));
+    return config;
+  },
+EOF
+
+tail -$(( ${CONFIG_LINES} - ${MOD_EXPORTS_LINE} + 1 )) next.config.js | grep -v 'process\.env\.' > next.config.js.5
+
+cat next.config.js.* | js-beautify > next.config.js
+rm next.config.js.*
+
+"${SCRIPT_DIR}/find-env.sh" "$(pwd)" > .env-list.json
+
+npm run build
+rm .env-list.json
@@ -0,0 +1,24 @@
+#!/bin/bash
+
+if [ -n "$CERC_SCRIPT_DEBUG" ]; then
+    set -x
+fi
+
+WORK_DIR="${1:-./}"
+TMPF=$(mktemp)
+
+cd "$WORK_DIR" || exit 1
+
+for d in $(find . -maxdepth 1 -type d | grep -v '\./\.' | grep '/' | cut -d'/' -f2); do
+  egrep "/$d[/$]?" .gitignore >/dev/null 2>/dev/null
+  if [ $? -eq 0 ]; then
+    continue
+  fi
+
+  for f in $(find "$d" -regex ".*.[tj]sx?$" -type f); do
+    cat "$f" | tr -s '[:blank:]' '\n' | tr -s '[{},()]' '\n' | egrep -o 'process.env.[A-Za-z0-9_]+' >> $TMPF
+  done
+done
+
+cat $TMPF | sort -u | jq  --raw-input .  | jq --slurp .
+rm -f $TMPF
@@ -0,0 +1,13 @@
+#!/usr/bin/env bash
+if [ -n "$CERC_SCRIPT_DEBUG" ]; then
+    set -x
+fi
+
+SCRIPT_DIR=$( cd -- "$( dirname -- "${BASH_SOURCE[0]}" )" &> /dev/null && pwd )
+
+CERC_WEBAPP_FILES_DIR="${CERC_WEBAPP_FILES_DIR:-/app}"
+cd "$CERC_WEBAPP_FILES_DIR"
+
+rm -rf .next-r
+"$SCRIPT_DIR/apply-runtime-env.sh" "`pwd`" .next .next-r
+npm start .next-r -p ${CERC_LISTEN_PORT:-3000}