configure webpack to watch for new auto-entries instead of restarting webpack with nodemonfix-webpack-dynamic-entries

2 files changed, 26 insertions, 7 deletions

diff --git a/config/webpack.config.js b/config/webpack.config.js
index 63ae13197ac..ea634163296 100644
--- a/config/webpack.config.js
+++ b/config/webpack.config.js
@@ -21,10 +21,16 @@ var DEV_SERVER_LIVERELOAD = process.env.DEV_SERVER_LIVERELOAD !== 'false';
 var WEBPACK_REPORT = process.env.WEBPACK_REPORT;
 var NO_COMPRESSION = process.env.NO_COMPRESSION;
 
+var autoEntriesCount = 0;
+var watchAutoEntries = [];
+
 function generateEntries() {
   // generate automatic entry points
   var autoEntries = {};
   var pageEntries = glob.sync('pages/**/index.js', { cwd: path.join(ROOT_PATH, 'app/assets/javascripts') });
+  watchAutoEntries = [
+    path.join(ROOT_PATH, 'app/assets/javascripts/pages/'),
+  ];
 
   function generateAutoEntries(path, prefix = '.') {
     const chunkPath = path.replace(/\/index\.js$/, '');
@@ -34,11 +40,7 @@ function generateEntries() {
 
   pageEntries.forEach(( path ) => generateAutoEntries(path));
 
-  // report our auto-generated bundle count
-  if (IS_DEV_SERVER) {
-    var autoEntriesCount = Object.keys(autoEntries).length;
-    console.log(`${autoEntriesCount} entries from '/pages' automatically added to webpack output.`);
-  }
+  autoEntriesCount = Object.keys(autoEntries).length;
 
   const manualEntries = {
     balsamiq_viewer:      './blob/balsamiq_viewer.js',
@@ -353,7 +355,24 @@ if (IS_DEV_SERVER) {
   };
   config.plugins.push(
     // watch node_modules for changes if we encounter a missing module compile error
-    new WatchMissingNodeModulesPlugin(path.join(ROOT_PATH, 'node_modules'))
+    new WatchMissingNodeModulesPlugin(path.join(ROOT_PATH, 'node_modules')),
+
+    // watch for changes to our automatic entry point modules
+    {
+      apply(compiler) {
+        compiler.plugin('emit', (compilation, callback) => {
+          compilation.contextDependencies = [
+            ...compilation.contextDependencies,
+            ...watchAutoEntries,
+          ];
+
+          // report our auto-generated bundle count
+          console.log(`${autoEntriesCount} entries from '/pages' automatically added to webpack output.`);
+
+          callback();
+        })
+      },
+    },
   );
   if (DEV_SERVER_LIVERELOAD) {
     config.plugins.push(new webpack.HotModuleReplacementPlugin());
diff --git a/package.json b/package.json
index 0b64750beff..cbad55b4c85 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "private": true,
   "scripts": {
-    "dev-server": "nodemon -w 'config/webpack.config.js' -w 'app/assets/javascripts/dispatcher.js' -w 'app/assets/javascripts/pages/**/index.js' --exec 'webpack-dev-server --config config/webpack.config.js'",
+    "dev-server": "nodemon -w 'config/webpack.config.js' --exec 'webpack-dev-server --config config/webpack.config.js'",
     "eslint": "eslint --max-warnings 0 --ext .js,.vue .",
     "eslint-fix": "eslint --max-warnings 0 --ext .js,.vue --fix .",
     "eslint-report": "eslint --max-warnings 0 --ext .js,.vue --format html --output-file ./eslint-report.html .",