From e5f78b32e2a38262b4a8b489ce1b56cfbebb729e Mon Sep 17 00:00:00 2001
From: Tom Robinson <tlrobinson@gmail.com>
Date: Thu, 11 Jun 2015 08:59:36 -0700
Subject: [PATCH] Fix for React being loaded twice.

If two chunks (with potentially overlapping modules) are intended to be
loaded on the same page we need to use CommonsChunkPlugin to extract the
common dependencies into a commons chunk to prevent some modules from
being loaded twice. Alternatively we could stop using multiple chunks.
---
 resources/frontend_client/index.html | 9 +++++----
 webpack.config.js                    | 6 +++---
 2 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/resources/frontend_client/index.html b/resources/frontend_client/index.html
index bd332b8c044..351fddef905 100644
--- a/resources/frontend_client/index.html
+++ b/resources/frontend_client/index.html
@@ -8,10 +8,11 @@
         <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
         <title>Metabase</title>
 
-        <link rel="stylesheet" href="/app/dist/styles.css"/>
-        <script charset="utf-8" src="/app/dist/styles.js"></script>
-        <script src="/app/dist/vendor.js"></script>
-        <script src="/app/dist/app.js"></script>
+        <link rel="stylesheet" href="/app/dist/styles.bundle.css"/>
+        <script charset="utf-8" src="/app/dist/common.bundle.js"></script>
+        <script charset="utf-8" src="/app/dist/styles.bundle.js"></script>
+        <script charset="utf-8" src="/app/dist/vendor.bundle.js"></script>
+        <script charset="utf-8" src="/app/dist/app.bundle.js"></script>
     </head>
 
     <body ng-controller="Corvus">
diff --git a/webpack.config.js b/webpack.config.js
index 23dce93ba01..19dc89e7c91 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -40,7 +40,7 @@ module.exports = {
     // output to "dist"
     output: {
         path: __dirname + '/resources/frontend_client/app/dist',
-        filename: '[name].js'
+        filename: '[name].bundle.js'
     },
 
     module: {
@@ -105,9 +105,9 @@ module.exports = {
         // new NgAnnotatePlugin({ add: true }),
         // Separates out modules common to multiple entry points into a single common file that should be loaded first.
         // Not currently useful but necessary for code-splitting
-        // new CommonsChunkPlugin('vendor', 'vendor.bundle.js'),
+        new CommonsChunkPlugin('common', 'common.bundle.js'),
         // Extracts initial CSS into a standard stylesheet that can be loaded in parallel with JavaScript
-        new ExtractTextPlugin('styles.css')
+        new ExtractTextPlugin('styles.bundle.css')
     ],
 
     // CSSNext configuration
-- 
GitLab