0

I'm trying to figure out how to configure Webpack 4's SplitChunks plugin. If I allow it to put modules in a shared/common chunk, it seems those modules are loaded async.

entry.js:

require("expose-loader?$!jquery");

This is included in the page:

<script src="bundle.js"></script>
<script>
$(function() {
   // do something spectacular
});
</script>

Without SplitChunks, JQuery is inside bundle.js and is immediately available to the page. However, once I enable SplitChunks and JQuery gets moved into a separate chunk, the page triggers an error: $ is not defined

Roman Pokrovskij
  • 9,449
  • 21
  • 87
  • 142
Webberig
  • 2,746
  • 1
  • 23
  • 19

1 Answers1

0

The behaviour of splitchunks is correct, the only thing that is missing is "expose" $ to be used everywhere.

Try ProvidePlugin: https://webpack.js.org/plugins/provide-plugin/#usage-jquery

PlayMa256
  • 6,603
  • 2
  • 34
  • 54