Merge branch 'fix-webpack-chunk-naming' into 'master'

Properly name webpack chunks for dynamic imports

See merge request gitlab-org/gitlab-ce!16066

app/assets/javascripts/dispatcher.js

@@ -110,6 +110,8 @@ import Activities from './activities';
         return false;
       }
 
+      const fail = () => Flash('Error loading dynamic module');
+
       path = page.split(':');
       shortcut_handler = null;
 
@@ -540,7 +542,7 @@ import Activities from './activities';
           new CILintEditor();
           break;
         case 'users:show':
-          new UserCallout();
+          import('./pages/users/show').then(m => m.default()).catch(fail);
           break;
         case 'admin:conversational_development_index:show':
           new UserCallout();

app/assets/javascripts/pages/users/show/index.js

+import UserCallout from '~/user_callout';
+
+export default () => new UserCallout();

config/webpack.config.js

@@ -176,8 +176,13 @@ var config = {
         return chunk.name;
       }
       return chunk.mapModules((m) => {
-        var chunkPath = m.request.split('!').pop();
-        return path.relative(m.context, chunkPath);
+        const pagesBase = path.join(ROOT_PATH, 'app/assets/javascripts/pages');
+        if (m.resource.indexOf(pagesBase) === 0) {
+          return path.relative(pagesBase, m.resource)
+            .replace(/\/index\.[a-z]+$/, '')
+            .replace(/\//g, '__');
+        }
+        return path.relative(m.context, m.resource);
       }).join('_');
     }),