Webpack: Does the order of plugins matter?

Webpack

Webpack Problem Overview


I looked it up at the docs here and here, searched StackOverflow and GitHub discussions and still can't find this information. Is there any resource or does anyone knows if the order of the plugins matter in Webpack? And how does the ordering work?

Webpack Solutions


Solution 1 - Webpack

Yes, the order matters: plugins are bound to the compiler and applied in the order specified. You can look into webpack/tapable for a clearer idea on how this works.

Usually, though, you are not forced to think about ordering when binding compiler and compilation plugins, as plugin authors expose specific events that help you reason when your handlers will be invoked.

Solution 2 - Webpack

Well, the answer is yes and no.

No because during the bundling, webpack emits several events which are fired at different phases of the compilation (you can read more about it here).

Each plugin must be hooked (by the plugin's author) to one of these events.

That being said, let's consider two plugins, A and B.

Even if A is listed before B in the config file, A will be executed before B only if it is hooked to an event that is fired before B's hooked event.

Yes because in case A and B are hooked to the same event, the execution order should be consistent with the order in the config file.

Solution 3 - Webpack

> webpack is not a task runner. These plugins are tasks, which is not "webpack-style" and not supported. You can report the issue there, but there is nothing to do on webpack side (and I don't care much). -sokra

ref

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionMatheus Dal'PizzolView Question on Stackoverflow
Solution 1 - WebpackFilip DupanovićView Answer on Stackoverflow
Solution 2 - WebpackLuca FagioliView Answer on Stackoverflow
Solution 3 - WebpackBrian OgdenView Answer on Stackoverflow