Add proper support for webpack's DynamicEntryPlugin

Author: mikegreiling

lib/util/addDevServerEntrypoints.js

@@ -19,16 +19,22 @@ module.exports = function addDevServerEntrypoints(webpackOptions, devServerOptio
 
     if (devServerOptions.hotOnly) { devClient.push('webpack/hot/only-dev-server'); } else if (devServerOptions.hot) { devClient.push('webpack/hot/dev-server'); }
 
-    [].concat(webpackOptions).forEach((wpOpt) => {
-      if (typeof wpOpt.entry === 'object' && !Array.isArray(wpOpt.entry)) {
-        Object.keys(wpOpt.entry).forEach((key) => {
-          wpOpt.entry[key] = devClient.concat(wpOpt.entry[key]);
+    const prependDevClient = (entry) => {
+      if (typeof entry === 'function') {
+        return () => Promise.resolve(entry()).then(prependDevClient);
+      }
+      if (typeof entry === 'object' && !Array.isArray(entry)) {
+        const entryClone = {};
+        Object.keys(entry).forEach((key) => {
+          entryClone[key] = devClient.concat(entry[key]);
         });
-      } else if (typeof wpOpt.entry === 'function') {
-        wpOpt.entry = wpOpt.entry(devClient);
-      } else {
-        wpOpt.entry = devClient.concat(wpOpt.entry || './src');
+        return entryClone;
       }
+      return devClient.concat(entry);
+    };
+
+    [].concat(webpackOptions).forEach((wpOpt) => {
+      wpOpt.entry = prependDevClient(wpOpt.entry || './src');
     });
   }
 };

test/Entry.test.js

@@ -4,7 +4,7 @@ const assert = require('assert');
 const addDevServerEntrypoints = require('../lib/util/addDevServerEntrypoints');
 const config = require('./fixtures/simple-config/webpack.config');
 
-describe('Entry', () => {
+describe.only('Entry', () => {
   it('adds devServer entry points to a single entry point', () => {
     const webpackOptions = Object.assign({}, config);
     const devServerOptions = {};
@@ -56,4 +56,58 @@ describe('Entry', () => {
     assert.equal(webpackOptions.entry.length, 2);
     assert.equal(webpackOptions.entry[1], './src');
   });
+
+  it('preserves dynamic entry points', (done) => {
+    let i = 0;
+    const webpackOptions = {
+      // simulate dynamic entry
+      entry: () => {
+        i += 1;
+        return `./src-${i}.js`;
+      }
+    };
+    const devServerOptions = {};
+
+    addDevServerEntrypoints(webpackOptions, devServerOptions);
+
+    assert(typeof webpackOptions.entry, 'function');
+
+    webpackOptions.entry().then(entryFirstRun => (
+      webpackOptions.entry().then((entrySecondRun) => {
+        assert.equal(entryFirstRun.length, 2);
+        assert.equal(entryFirstRun[1], './src-1.js');
+
+        assert.equal(entrySecondRun.length, 2);
+        assert.equal(entrySecondRun[1], './src-2.js');
+        done();
+      })
+    )).catch(done);
+  });
+
+  it('preserves asynchronous dynamic entry points', (done) => {
+    let i = 0;
+    const webpackOptions = {
+      // simulate async dynamic entry
+      entry: () => new Promise((resolve) => {
+        i += 1;
+        resolve(`./src-${i}.js`);
+      })
+    };
+    const devServerOptions = {};
+
+    addDevServerEntrypoints(webpackOptions, devServerOptions);
+
+    assert(typeof webpackOptions.entry, 'function');
+
+    webpackOptions.entry().then(entryFirstRun => (
+      webpackOptions.entry().then((entrySecondRun) => {
+        assert.equal(entryFirstRun.length, 2);
+        assert.equal(entryFirstRun[1], './src-1.js');
+
+        assert.equal(entrySecondRun.length, 2);
+        assert.equal(entrySecondRun[1], './src-2.js');
+        done();
+      })
+    )).catch(done);
+  });
 });