Unexpected result of entry points merge

[mostlyobvious]

I have multiple entry points in my webpack config:

  entryPoint({
    'a': './a.js',
    'b': './b.js',
  }),

I have also defined development env with devServer block:

  env('development', [
    devServer({ stats: 'minimal' }),
    setOutput({
      filename: '[name].js',
      publicPath: "http://localhost:8080/javascripts/",
    }),
  ]),

This devServer block returns 'webpack/hot/only-dev-server' for each entry point key, letting webpack-merge merge it later with original entry points:
https://github.com/andywer/webpack-blocks/blob/master/packages/webpack-common/src/devServer.js#L43-L59

In the end one would expect to get following entry points in development env:

      { a: [ './a.js', 'webpack/hot/only-dev-server' ],
        b: [ './b.js', 'webpack/hot/only-dev-server' ] }

What I'm observing however is:

      { a: [ './a.js', 'webpack/hot/only-dev-server' ],
        b: [ './a.js', 'webpack/hot/only-dev-server' ] }

First entry point value is replicated over latter entry keys.

I've managed to isolate minimal configuration under which this behaviour can be reproduced. Have a look at: https://github.com/pawelpacana/webpack-blocks-multiple-entries-dev-server-merge

For clarity, precise software versions under which I can observe this behaviour:

$ yarn --version
0.18.1

$ node -v
v7.4.0

$ grep webpack-blocks package.json
    "@webpack-blocks/babel6": "^0.3.0",
    "@webpack-blocks/dev-server": "^0.3.0",
    "@webpack-blocks/extract-text": "^0.3.0",
    "@webpack-blocks/postcss": "^0.3.0",
    "@webpack-blocks/sass": "^0.3.0",
    "@webpack-blocks/webpack": "^0.3.0",

As a workaround I've used following snippet to get predictable merge behaviour:

   env('development', [
-    devServer({ stats: 'minimal' }),
+    customConfig({
+      entry: {
+        'a': ['webpack/hot/only-dev-server'],
+        'b': ['webpack/hot/only-dev-server'],
+      },
+      devServer: {
+        stats: 'minimal',
+        hot: true,
+        inline: true,
+        historyApiFallback: true
+      }
+    }),
    setOutput({
      filename: '[name].js',
      publicPath: "http://localhost:8080/javascripts/",
    }),
  ]),

[andywer]

Hey @pawelpacana. Thanks for reporting!

+1 for the excellent bug report :)

Looks like an issue with webpack-merge. We are currently using an outdated version of webpack-merge, so an upgrade might solve the issue, even though I could not find such a bug fix in its changelog. Maybe it is even easier in the long term to get rid of webpack-merge altogether (#34).

Will have a look at it tomorrow!

[eXon]

I think this is going to be fixed with #59

We are still on a old webpack-merge version and the merging should be fine afterward.

[mostlyobvious]

Looks like an issue with webpack-merge

I thought so initially. Providing relevant config partials to merge.smart() however results in correct merge result: https://github.com/pawelpacana/webpack-blocks-multiple-entries-dev-server-merge/blob/master/webpack.config.js#L33-L36

I've spent some time with tracking source of this issue today and:

• it starts in https://github.com/andywer/webpack-blocks/blob/master/packages/core/src/index.js#L34
• via invokePostHooks, then invokeConfigSetters we get to configSetters.reduce in which there is merge.smart(mergedConfig, configPartial)
• result of this merge.smart operation (on partial with entry points) seemed fine within console.log as well but in the end postProcessedConfig was wrong

[andywer]

Will keep this issue open until the updated packages have been published.

[andywer]

Please try the 0.4.0-rc version of @webpack-blocks/extract-text and @webpack-blocks/webpack :)

It contains the upgrade to webpack-merge 2.3 which should solve your issue.

[mostlyobvious]

Thanks! Seems like the problem is solved now.