fix: cleanup, passthrough runtime variables (#710)

fix: passthrough runtime variables

Signed-off-by: Carina Ursu <[email protected]>

Dockerfile

@@ -13,23 +13,12 @@ COPY . /my-project/
 RUN : \
   --mount=type=cache,target=/root/.yarn \
   # install production dependencies
-  && yarn workspaces focus @flyteconsole/client-app --production \
-  # move the production dependencies to the /app folder
-  && mkdir /app \
-  && rm -rf node_modules/@flyteorg \
-  && cp -R node_modules /app
-
-RUN : \
-  --mount=type=cache,target=/root/.yarn \
-  # install all dependencies so we can build
   && yarn workspaces focus --all --production \
   && yarn build:types \
   && BASE_URL=/console yarn run build:prod \
+  && mkdir /app \
   && cp -R ./website/dist/* /app
 
-RUN rm -rf /app/node_modules
-RUN rm -f /app/client-stats.json
-
 FROM gcr.io/distroless/nodejs
 LABEL org.opencontainers.image.source https://github.com/flyteorg/flyteconsole
 

package.json

@@ -91,8 +91,7 @@
     "webpack-cli": "^4.10.0",
     "webpack-dev-server": "^4.7.4",
     "webpack-merge": "^5.8.0",
-    "webpack-node-externals": "^3.0.0",
-    "webpack-stats-plugin": "^1.1.1"
+    "webpack-node-externals": "^3.0.0"
   },
   "devDependencies": {
     "@babel/core": "~7.16.12",

website/package.json

@@ -14,7 +14,7 @@
     "build": "TS_NODE_COMPILER_OPTIONS='{\"module\": \"commonjs\"}' NODE_ENV=development run -T webpack --config webpack.config.ts --mode=development --progress",
     "build:prod": "TS_NODE_COMPILER_OPTIONS='{\"module\": \"commonjs\"}' NODE_ENV=production run -T webpack --config webpack.config.ts --mode=production --progress",
     "start": "NODE_ENV=development run -T webpack serve --config webpack.config.ts --mode=development",
-    "start:prod": "NODE_ENV=production node -r dotenv/config dist/server.js",
+    "start:prod": "NODE_ENV=production node dist/server.js",
     "lint": "run -T eslint . --ext .js,.jsx,.ts,.tsx",
     "format": "run -T prettier --ignore-path .eslintignore --write \"**/*.+(js|jsx|ts|tsx|json)\"",
     "fix": "yarn lint --fix && yarn format",

website/src/server/index.ts

@@ -13,11 +13,12 @@ import { applyMiddleware } from './plugins';
 import env from '../../env';
 
 const expressStaticGzip = require('express-static-gzip');
+const dotenv = require('dotenv');
 
-console.log(env);
+// configure runtime env variables
+dotenv.config();
 
 const PORT = process.env.PORT || 3000;
-
 const app = express();
 
 // Enable logging for HTTP access
@@ -45,6 +46,11 @@ const showEntryPointUrl = () => {
     env.LOCAL_DEV_HOST || env.ADMIN_API_URL?.replace('https', '')
   }:${PORT}${env.BASE_URL}`;
 
+  console.log(
+    chalk.green(`App started with the following config:`),
+    chalk.white(JSON.stringify(env, null, 2)),
+  );
+
   // Open a new browser tab if in development
   if (env.NODE_ENV === 'development') {
     // eslint-disable-next-line global-require
@@ -77,7 +83,6 @@ if (env.ADMIN_API_USE_SSL === 'https') {
       app,
     )
     .listen(PORT, showEntryPointUrl);
-  console.log(`Server started with SSL: https://localhost:${PORT}/`);
 } else {
   server = app.listen(PORT, showEntryPointUrl);
 }

website/webpack.config.ts

@@ -14,7 +14,6 @@ import {
   WEBPACK_PATHS,
   getConfigFile,
   getDefinePlugin,
-  statsWriterPlugin,
   resolveOptions,
   getModuleOptions,
   getShouldLoadReactFromCDN,
@@ -89,7 +88,6 @@ module.exports = (_env: any, argv: { mode: Mode }) => {
       module: getModuleOptions(mode),
 
       plugins: [
-        statsWriterPlugin,
         getDefinePlugin(false),
         new NodePolyfillPlugin({
           includeAliases: ['http', 'https', 'stream', 'zlib'],

website/webpack.utilities.ts

@@ -14,7 +14,6 @@ import {
 } from './env';
 
 const fs = require('fs');
-const { StatsWriterPlugin } = require('webpack-stats-plugin');
 
 export type Mode = 'development' | 'production';
 
@@ -112,7 +111,7 @@ export const logWebpackStats = (mode: Mode) => {
   );
   console.log(chalk.blue('Public path:'), chalk.green(publicPath));
   console.log(
-    chalk.yellow('TSconfig file used for build:'),
+    chalk.blue('TSconfig file used for build:'),
     chalk.green(getConfigFile(mode)),
   );
 };
@@ -134,18 +133,6 @@ export function absoluteVersion(version: string) {
  **************************************************************************************
  **************************************************************************************
  */
-/** Write client stats to a JSON file for production */
-export const statsWriterPlugin = new StatsWriterPlugin({
-  filename: 'client-stats.json',
-  fields: [
-    'chunks',
-    'publicPath',
-    'assets',
-    'assetsByChunkName',
-    'assetsByChunkId',
-  ],
-});
-
 /** Limit server chunks to be only one. No need to split code in server */
 export const LimitChunksPlugin = new webpack.optimize.LimitChunkCountPlugin({
   maxChunks: 1,

yarn.lock

@@ -11578,7 +11578,6 @@ __metadata:
     webpack-dev-server: ^4.7.4
     webpack-merge: ^5.8.0
     webpack-node-externals: ^3.0.0
-    webpack-stats-plugin: ^1.1.1
   languageName: unknown
   linkType: soft
 
@@ -22404,13 +22403,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"webpack-stats-plugin@npm:^1.1.1":
-  version: 1.1.1
-  resolution: "webpack-stats-plugin@npm:1.1.1"
-  checksum: aa553ccfb9389f2d8a2d04eb6289230bc323edb11b0cbdd676d41617dd790a7f0d0844c46b927a9465139b3edb9da2cc7a2ef664891920c052ef4fa5f2797230
-  languageName: node
-  linkType: hard
-
 "webpack-virtual-modules@npm:^0.2.2":
   version: 0.2.2
   resolution: "webpack-virtual-modules@npm:0.2.2"