Merge pull request #15382 from edx/ormsbee/webpack_common_chunk_vagrant

Add support for CommonsChunkPlugin for Webpack.

common/djangoapps/pipeline_mako/templates/static_content.html

@@ -96,6 +96,7 @@ source, template_path = Loader(engine).load_template_source(path)
         try:
             return Template("""
                 {% load render_bundle from webpack_loader %}
+                {% render_bundle "commons" %}
                 {% render_bundle entry %}
                 <script type="text/javascript">
                     {% autoescape off %}{{ body }}{% endautoescape %}

common/static/common/js/karma.common.conf.js

@@ -44,6 +44,18 @@ var webpackConfig = require(path.join(appRoot, 'webpack.config.js'));
 
 delete webpackConfig.entry;
 
+// The following crazy bit is to work around the webpack.optimize.CommonsChunkPlugin
+// plugin. The problem is that it it factors out the code that defines webpackJsonp
+// and puts in in the commons JS, which Karma doesn't know to load first. This is a
+// workaround recommended in the karma-webpack bug report that basically just removes
+// the plugin for the purposes of Karma testing (the plugin is meant to be an
+// optimization only).
+//     https://github.com/webpack-contrib/karma-webpack/issues/24#issuecomment-257613167
+//
+// This should be fixed in v3 of karma-webpack
+const commonsChunkPluginIndex = webpackConfig.plugins.findIndex(plugin => plugin.chunkNames);
+webpackConfig.plugins.splice(commonsChunkPluginIndex, 1);
+
 // Files which are needed by all lms/cms suites.
 var commonFiles = {
     libraryFiles: [

webpack.config.js

@@ -54,6 +54,21 @@ var wpconfig = {
             $: 'jquery',
             jQuery: 'jquery',
             'window.jQuery': 'jquery'
+        }),
+
+        // Note: Until karma-webpack releases v3, it doesn't play well with
+        // the CommonsChunkPlugin. We have a kludge in karma.common.conf.js
+        // that dynamically removes this plugin from webpack config when
+        // running those tests (the details are in that file). This is a
+        // recommended workaround, as this plugin is just an optimization. But
+        // because of this, we really don't want to get too fancy with how we
+        // invoke this plugin until we can upgrade karma-webpack.
+        new webpack.optimize.CommonsChunkPlugin({
+            // If the value below changes, update the render_bundle call in
+            // common/djangoapps/pipeline_mako/templates/static_content.html 
+            name: 'commons',
+            filename: 'commons.js',
+            minChunks: 2
         })
     ],