Restore STANDALONE and .env (#1226)

web/.env.sample

@@ -1,2 +0,0 @@
-PORT=3020
-API_URL=http://localhost:3000

web/config/webpack.common.js

@@ -34,8 +34,8 @@ module.exports = {
   target: 'web',
   context: CONTEXT,
   stats: {
-    modules: true,
+    modules: false,
-    children: true
+    children: false
   },
   entry: {
     [moduleFederationConfig.name]: './src/public-path'
@@ -186,92 +186,6 @@ module.exports = {
     extensions: ['.mjs', '.js', '.ts', '.tsx', '.json', '.ttf', '.scss'],
     plugins: [new TsconfigPathsPlugin()]
   },
-  optimization: {
-    splitChunks: {
-      minSize: 20_480,
-      automaticNameDelimiter: '-',
-
-      cacheGroups: {
-        common: {
-          test: /[\\/]node_modules[\\/]/,
-          priority: -5,
-          reuseExistingChunk: true,
-          chunks: 'initial',
-          name: 'vendor-common',
-          minSize: 20_480,
-          maxSize: 512_000
-        },
-
-        default: {
-          minChunks: 2,
-          priority: -10,
-          reuseExistingChunk: true,
-          minSize: 20_480,
-          maxSize: 512_000
-        },
-
-        // Opting out of defaultVendors, so rest of the node modules will be part of default cacheGroup
-        defaultVendors: false,
-
-        react: {
-          test: /[\\/]node_modules[\\/](react-dom)[\\/]/,
-          name: 'vendor-react',
-          chunks: 'all',
-          priority: 50
-        },
-
-        reactdom: {
-          test: /[\\/]node_modules[\\/](react-dom)[\\/]/,
-          name: 'vendor-react-dom',
-          chunks: 'all',
-          priority: 40
-        },
-
-        reactrouterdom: {
-          test: /[\\/]node_modules[\\/](react-router-dom)[\\/]/,
-          name: 'vendor-react-router-dom',
-          chunks: 'all',
-          priority: 30,
-          minSize: 0
-        },
-
-        blueprintjs: {
-          test: /[\\/]node_modules[\\/](@blueprintjs)[\\/]/,
-          name: 'vendor-blueprintjs',
-          chunks: 'all',
-          priority: 20
-        },
-
-        restfulreact: {
-          test: /[\\/]node_modules[\\/](restful-react)[\\/]/,
-          name: 'vendor-restful-react',
-          chunks: 'all',
-          priority: 10
-        },
-
-        designsystem: {
-          test: /[\\/]node_modules[\\/](@harnessio\/design-system)[\\/]/,
-          name: 'vendor-harnessio-design-system',
-          chunks: 'all',
-          priority: 5
-        },
-
-        icons: {
-          test: /[\\/]node_modules[\\/](@harnessio\/icons)[\\/]/,
-          name: 'vendor-harnessio-icons',
-          chunks: 'all',
-          priority: 1
-        },
-
-        uicore: {
-          test: /[\\/]node_modules[\\/](@harnessio\/uicore)[\\/]/,
-          name: 'vendor-harnessio-uicore',
-          chunks: 'all',
-          priority: 1
-        }
-      }
-    }
-  },
   plugins: [
     new MiniCssExtractPlugin({
       ignoreOrder: true,

web/config/webpack.dev.js

@@ -24,11 +24,12 @@ const commonConfig = require('./webpack.common')
 const API_URL = process.env.API_URL ?? 'http://localhost:3000'
 const HOST = 'localhost'
 const PORT = process.env.PORT ?? 3020
+const STANDALONE = process.env.STANDALONE === 'true'
 const CONTEXT = process.cwd()
 
 console.info(`Starting development build... http://${HOST}:${PORT}`)
 console.info('Environment variables:')
-console.table({ HOST, PORT, API_URL })
+console.table({ STANDALONE, HOST, PORT, API_URL })
 
 const devConfig = {
   mode: 'development',
@@ -37,11 +38,9 @@ const devConfig = {
   devtool: 'cheap-module-source-map',
   cache: { type: 'filesystem' },
   output: {
-    publicPath: '/'
+    publicPath: STANDALONE ? '/' : 'auto'
-  },
-  optimization: {
-    runtimeChunk: 'single'
   },
+  optimization: STANDALONE ? { runtimeChunk: 'single' } : {},
   devServer: {
     hot: true,
     host: HOST,

web/config/webpack.prod.js

@@ -23,7 +23,94 @@ const prodConfig = {
   context: CONTEXT,
   mode: 'production',
   entry: path.resolve(CONTEXT, '/src/index.tsx'),
-  devtool: process.env.ENABLE_SOURCE_MAP ? 'source-map' : false
+  devtool: process.env.ENABLE_SOURCE_MAP ? 'source-map' : false,
+  optimization: {
+    splitChunks: {
+      minSize: 20_480,
+      automaticNameDelimiter: '-',
+
+      cacheGroups: {
+        common: {
+          test: /[\\/]node_modules[\\/]/,
+          priority: -5,
+          reuseExistingChunk: true,
+          chunks: 'initial',
+          name: 'vendor-common',
+          minSize: 20_480,
+          maxSize: 1_024_000
+        },
+
+        default: {
+          minChunks: 2,
+          priority: -10,
+          reuseExistingChunk: true,
+          minSize: 20_480,
+          maxSize: 1_024_000
+        },
+
+        // Opting out of defaultVendors, so rest of the node modules will be part of default cacheGroup
+        defaultVendors: false,
+
+        react: {
+          test: /[\\/]node_modules[\\/](react)[\\/]/,
+          name: 'vendor-react',
+          chunks: 'all',
+          priority: 50,
+          minSize: 0
+        },
+
+        reactdom: {
+          test: /[\\/]node_modules[\\/](react-dom)[\\/]/,
+          name: 'vendor-react-dom',
+          chunks: 'all',
+          priority: 40
+        },
+
+        reactrouterdom: {
+          test: /[\\/]node_modules[\\/](react-router-dom)[\\/]/,
+          name: 'vendor-react-router-dom',
+          chunks: 'all',
+          priority: 30,
+          minSize: 0
+        },
+
+        blueprintjs: {
+          test: /[\\/]node_modules[\\/](@blueprintjs)[\\/]/,
+          name: 'vendor-blueprintjs',
+          chunks: 'all',
+          priority: 20
+        },
+
+        restfulreact: {
+          test: /[\\/]node_modules[\\/](restful-react)[\\/]/,
+          name: 'vendor-restful-react',
+          chunks: 'all',
+          priority: 10
+        },
+
+        designsystem: {
+          test: /[\\/]node_modules[\\/](@harnessio\/design-system)[\\/]/,
+          name: 'vendor-harnessio-design-system',
+          chunks: 'all',
+          priority: 5
+        },
+
+        icons: {
+          test: /[\\/]node_modules[\\/](@harnessio\/icons)[\\/]/,
+          name: 'vendor-harnessio-icons',
+          chunks: 'all',
+          priority: 1
+        },
+
+        uicore: {
+          test: /[\\/]node_modules[\\/](@harnessio\/uicore)[\\/]/,
+          name: 'vendor-harnessio-uicore',
+          chunks: 'all',
+          priority: 1
+        }
+      }
+    }
+  }
 }
 
 module.exports = merge(commonConfig, prodConfig)