feat: map client env values in webpack config instead of root config

Author: calvinl

config/index.js

@@ -1,5 +1,3 @@
-const { mapValues, keyBy } = require('lodash');
-
 module.exports = {
   // Enable or disable server-side rendering
   enableSSR: true,
@@ -12,13 +10,10 @@ module.exports = {
   // in node.js.
   //
   // **WARNING**: Be careful not to expose any secrets here!
-  clientEnv: mapValues(
-    keyBy([
-      'NODE_ENV',
-      'APPLICATION_BASE_URL'
-    ]),
-    (env) => JSON.stringify(process.env[env])
-  ),
+  clientEnvVars: [
+    'NODE_ENV',
+    'APPLICATION_BASE_URL'
+  ],
 
   /* The identifier to use for css-modules.
    */

webpack/base.js

@@ -4,11 +4,11 @@ if (isDev) require('dotenv').load();
 import yn from 'yn';
 import path from 'path';
 import webpack from 'webpack';
-import mapValues from 'lodash/mapValues';
 import IsoPlugin from 'webpack-isomorphic-tools/plugin';
 import ExtractTextPlugin from 'extract-text-webpack-plugin';
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer';
 import { ReactLoadablePlugin } from 'react-loadable/webpack';
+import { mapValues, keyBy } from 'lodash';
 import config from '../config';
 
 let ssr = yn(process.env.SSR) || false;
@@ -24,7 +24,9 @@ let plugins = [
   extractTextPlugin,
   new webpack.ContextReplacementPlugin(/moment[/\\]locale$/, /en|es/),
   new webpack.DefinePlugin({
-    'process.env': config.clientEnv
+    'process.env': mapValues(keyBy(config.clientEnvVars), (env) => {
+      return JSON.stringify(process.env[env]);
+    })
   })
 ];