From 3ae532aee5a4a6e7ded4b37e9daacab6a207282d Mon Sep 17 00:00:00 2001
From: Nolan Lawson <nolan@nolanlawson.com>
Date: Sat, 15 Dec 2018 19:21:20 -0800
Subject: [PATCH] fix: fix NODE_ENV and webpack config (#818)

---
 package.json                     |  2 +-
 src/client.js                    |  2 ++
 webpack/client.config.js         | 16 ++++++++--------
 webpack/server.config.js         |  5 ++---
 webpack/service-worker.config.js |  9 ++++-----
 webpack/shared.config.js         |  7 +++++++
 6 files changed, 24 insertions(+), 17 deletions(-)
 create mode 100644 webpack/shared.config.js

diff --git a/package.json b/package.json
index ccd6ba2a..01cc8206 100644
--- a/package.json
+++ b/package.json
@@ -7,7 +7,7 @@
     "lint-fix": "standard --fix && standard --fix --plugin html 'src/routes/**/*.html'",
     "dev": "run-s build-svg build-inline-script serve-dev",
     "serve-dev": "run-p --race build-sass-watch sapper-dev",
-    "sapper-dev": "cross-env PORT=4002 sapper dev",
+    "sapper-dev": "cross-env NODE_ENV=development PORT=4002 sapper dev",
     "sapper-prod": "cross-env PORT=4002 node __sapper__/build",
     "build": "cross-env NODE_ENV=production npm run build-steps",
     "build-steps": "run-s build-sass build-svg build-inline-script sapper-build",
diff --git a/src/client.js b/src/client.js
index 13bcf127..e5312105 100644
--- a/src/client.js
+++ b/src/client.js
@@ -9,6 +9,8 @@ loadPolyfills().then(() => {
   sapper.start({ target: document.querySelector('#sapper') })
 })
 
+console.log('process.env.NODE_ENV', process.env.NODE_ENV)
+
 if (module.hot) {
   module.hot.accept()
 }
diff --git a/webpack/client.config.js b/webpack/client.config.js
index d43549dd..27f05284 100644
--- a/webpack/client.config.js
+++ b/webpack/client.config.js
@@ -3,7 +3,7 @@ const config = require('sapper/config/webpack.js')
 const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
 const LodashModuleReplacementPlugin = require('lodash-webpack-plugin')
 const terser = require('./terser.config')
-const isDev = process.env.NODE_ENV === 'development'
+const { mode, dev } = require('./shared.config')
 
 module.exports = {
   entry: config.client.entry(),
@@ -12,7 +12,7 @@ module.exports = {
     extensions: ['.js', '.json', '.html'],
     mainFields: ['svelte', 'module', 'browser', 'main']
   },
-  mode: isDev ? 'development' : 'production',
+  mode,
   module: {
     rules: [
       {
@@ -20,10 +20,10 @@ module.exports = {
         use: {
           loader: 'svelte-loader',
           options: {
-            dev: isDev,
+            dev,
             hydratable: true,
             store: true,
-            hotReload: isDev
+            hotReload: dev
           }
         }
       }
@@ -32,7 +32,7 @@ module.exports = {
   node: {
     setImmediate: false
   },
-  optimization: isDev ? {} : {
+  optimization: dev ? {} : {
     minimizer: [
       terser()
     ],
@@ -51,14 +51,14 @@ module.exports = {
     new LodashModuleReplacementPlugin({
       paths: true
     })
-  ].concat(isDev ? [
+  ].concat(dev ? [
     new webpack.HotModuleReplacementPlugin({
       requestTimeout: 120000
     })
   ] : [
     new webpack.DefinePlugin({
       'process.browser': true,
-      'process.env.NODE_ENV': '"production"'
+      'process.env.NODE_ENV': JSON.stringify(mode)
     }),
     new BundleAnalyzerPlugin({ // generates report.html and stats.json
       analyzerMode: 'static',
@@ -71,5 +71,5 @@ module.exports = {
       logLevel: 'silent' // do not bother Webpacker, who runs with --json and parses stdout
     })
   ]),
-  devtool: isDev ? 'inline-source-map' : 'source-map'
+  devtool: dev ? 'inline-source-map' : 'source-map'
 }
diff --git a/webpack/server.config.js b/webpack/server.config.js
index 9ad7c934..f40c0941 100644
--- a/webpack/server.config.js
+++ b/webpack/server.config.js
@@ -1,7 +1,6 @@
 const config = require('sapper/config/webpack.js')
 const pkg = require('../package.json')
-
-const dev = process.env.NODE_ENV === 'development'
+const { mode, dev } = require('./shared.config')
 
 module.exports = {
   entry: config.server.entry(),
@@ -29,7 +28,7 @@ module.exports = {
       }
     ]
   },
-  mode: process.env.NODE_ENV,
+  mode,
   performance: {
     hints: false // it doesn't matter if server.js is large
   }
diff --git a/webpack/service-worker.config.js b/webpack/service-worker.config.js
index dc5b7acb..6d56f571 100644
--- a/webpack/service-worker.config.js
+++ b/webpack/service-worker.config.js
@@ -1,18 +1,17 @@
 const config = require('sapper/config/webpack.js')
 const terser = require('./terser.config')
 const webpack = require('webpack')
-
-const isDev = config.dev
+const { mode, dev } = require('./shared.config')
 
 module.exports = {
   entry: config.serviceworker.entry(),
   output: config.serviceworker.output(),
-  mode: process.env.NODE_ENV,
-  devtool: isDev ? 'inline-source-map' : 'source-map',
+  mode,
+  devtool: dev ? 'inline-source-map' : 'source-map',
   plugins: [
     new webpack.DefinePlugin({
       'process.browser': true,
-      'process.env.NODE_ENV': '"production"',
+      'process.env.NODE_ENV': JSON.stringify(mode),
       'process.env.SAPPER_TIMESTAMP': process.env.SAPPER_TIMESTAMP || Date.now()
     }),
     terser()
diff --git a/webpack/shared.config.js b/webpack/shared.config.js
new file mode 100644
index 00000000..27dbe592
--- /dev/null
+++ b/webpack/shared.config.js
@@ -0,0 +1,7 @@
+const mode = process.env.NODE_ENV
+const dev = mode === 'development'
+
+module.exports = {
+  mode,
+  dev
+}