Refactor to allow exporting logic of inliningCss

package/__tests__/env.js

@@ -15,7 +15,8 @@ describe('Env', () => {
       railsEnv: 'development',
       nodeEnv: 'development',
       isProduction: false,
-      isDevelopment: true
+      isDevelopment: true,
+      runningWebpackDevServer: false
     })
   })
 
@@ -26,7 +27,8 @@ describe('Env', () => {
       railsEnv: 'development',
       nodeEnv: 'production',
       isProduction: true,
-      isDevelopment: false
+      isDevelopment: false,
+      runningWebpackDevServer: false
     })
   })
 
@@ -37,7 +39,8 @@ describe('Env', () => {
       railsEnv: 'production',
       nodeEnv: 'production',
       isProduction: true,
-      isDevelopment: false
+      isDevelopment: false,
+      runningWebpackDevServer: false
     })
   })
 
@@ -48,7 +51,8 @@ describe('Env', () => {
       railsEnv: 'staging',
       nodeEnv: 'production',
       isProduction: true,
-      isDevelopment: false
+      isDevelopment: false,
+      runningWebpackDevServer: false
     })
   })
 })

package/env.js

@@ -16,9 +16,15 @@ const config = safeLoad(readFileSync(configPath), 'utf8')
 const availableEnvironments = Object.keys(config).join('|')
 const regex = new RegExp(`^(${availableEnvironments})$`, 'g')
 
+// v4 of webpack-dev-server will switch to WEBPACK_DEV_SERVE
+// https://github.com/rails/webpacker/issues/3057
+const runningWebpackDevServer = process.env.WEBPACK_DEV_SERVER === 'true' ||
+  process.env.WEBPACK_DEV_SERVE === 'true'
+
 module.exports = {
   railsEnv: railsEnv && railsEnv.match(regex) ? railsEnv : DEFAULT,
   nodeEnv,
   isProduction,
-  isDevelopment
+  isDevelopment,
+  runningWebpackDevServer
 }

package/environments/development.js

@@ -2,7 +2,7 @@ const { merge } = require('webpack-merge')
 
 const baseConfig = require('./base')
 const devServer = require('../dev_server')
-const { runningWebpackDevServer } = require('../utils/helpers')
+const { runningWebpackDevServer } = require('../env')
 
 const { outputPath: contentBase, publicPath } = require('../config')
 

package/index.js

@@ -10,6 +10,7 @@ const config = require('./config')
 const devServer = require('./dev_server')
 const { nodeEnv } = require('./env')
 const { moduleExists, canProcess } = require('./utils/helpers')
+const inliningCss = require('./inliningCss')
 
 const webpackConfig = () => {
   const path = resolve(__dirname, 'environments', `${nodeEnv}.js`)
@@ -25,5 +26,6 @@ module.exports = {
   rules,
   moduleExists,
   canProcess,
+  inliningCss,
   ...webpackMerge
 }

package/inliningCss.js

@@ -0,0 +1,7 @@
+const { runningWebpackDevServer } = require('./env')
+const devServer = require('./dev_server')
+
+// This logic is tied to lib/webpacker/instance.rb
+const inliningCss = runningWebpackDevServer && devServer.hmr
+
+module.exports = inliningCss

package/utils/get_style_rule.js

@@ -1,7 +1,6 @@
 /* eslint global-require: 0 */
-
-const devServer = require('../dev_server')
-const { canProcess, moduleExists, runningWebpackDevServer } = require('./helpers')
+const { canProcess, moduleExists } = require('./helpers')
+const inliningCss = require('../inliningCss')
 
 const getStyleRule = (test, preprocessors = []) => {
   if (moduleExists('css-loader')) {
@@ -12,7 +11,6 @@ const getStyleRule = (test, preprocessors = []) => {
       }))
 
     // style-loader is required when using css modules with HMR on the webpack-dev-server
-    const inliningCss = runningWebpackDevServer && devServer.hmr
 
     const use = [
       inliningCss ? 'style-loader' : require('mini-css-extract-plugin').loader,

package/utils/helpers.js

@@ -39,11 +39,6 @@ const canProcess = (rule, fn) => {
   return null
 }
 
-// v4 of webpack-dev-server will switch to WEBPACK_DEV_SERVE
-// https://github.com/rails/webpacker/issues/3057
-const runningWebpackDevServer = process.env.WEBPACK_DEV_SERVER === 'true' ||
-  process.env.WEBPACK_DEV_SERVE === 'true'
-
 module.exports = {
   chdirTestApp,
   chdirCwd,
@@ -52,6 +47,5 @@ module.exports = {
   ensureTrailingSlash,
   canProcess,
   moduleExists,
-  resetEnv,
-  runningWebpackDevServer
+  resetEnv
 }