create a cacheable commons bundle for our Vue bundles

app/assets/javascripts/lib/vue_resource.js.es6

-window.Vue = require('vue');
-window.Vue.use(require('vue-resource'));

app/views/projects/boards/_show.html.haml

@@ -3,6 +3,7 @@
 - page_title "Boards"
 
 - content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('boards')
   = page_specific_javascript_bundle_tag('simulate_drag') if Rails.env.test?
 

app/views/projects/commit/_pipelines_list.haml

@@ -4,4 +4,5 @@
 } }
 
 - content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('commit_pipelines')

app/views/projects/cycle_analytics/show.html.haml

 - @no_container = true
 - page_title "Cycle Analytics"
 - content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('cycle_analytics')
 
 = render "projects/head"

app/views/projects/environments/folder.html.haml

@@ -3,6 +3,7 @@
 = render "projects/pipelines/head"
 
 - content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag("environments_folder")
 
 #environments-folder-list-view{ data: { "can-create-deployment" => can?(current_user, :create_deployment, @project).to_s,

app/views/projects/environments/index.html.haml

@@ -3,6 +3,7 @@
 = render "projects/pipelines/head"
 
 - content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag("environments")
 
 #environments-list-view{ data: { environments_data: environments_list_data,

app/views/projects/issues/show.html.haml

@@ -3,7 +3,7 @@
 - page_description     @issue.description
 - page_card_attributes @issue.card_attributes
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('lib_vue')
+  = page_specific_javascript_bundle_tag('common_vue')
 
 .clearfix.detail-page-header
   .issuable-header

app/views/projects/merge_requests/_show.html.haml

@@ -3,6 +3,7 @@
 - page_description     @merge_request.description
 - page_card_attributes @merge_request.card_attributes
 - content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('diff_notes')
 
 .merge-request{ 'data-url' => merge_request_path(@merge_request), 'data-project-path' => project_path(@merge_request.project) }

app/views/projects/merge_requests/conflicts.html.haml

 - page_title "Merge Conflicts", "#{@merge_request.title} (#{@merge_request.to_reference}", "Merge Requests"
 - content_for :page_specific_javascripts do
-  = page_specific_javascript_bundle_tag('lib_vue')
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('merge_conflicts')
   = page_specific_javascript_tag('lib/ace.js')
 = render "projects/merge_requests/show/mr_title"

app/views/projects/pipelines/index.html.haml

@@ -50,4 +50,5 @@
   .content-list.pipelines{ data: { url: namespace_project_pipelines_path(@project.namespace, @project, format: :json) } }
     .vue-pipelines-index
 
+= page_specific_javascript_bundle_tag('common_vue')
 = page_specific_javascript_bundle_tag('vue_pipelines')

app/views/shared/issuable/_sidebar.html.haml

 - todo = issuable_todo(issuable)
 - content_for :page_specific_javascripts do
+  = page_specific_javascript_bundle_tag('common_vue')
   = page_specific_javascript_bundle_tag('issuable')
 
 %aside.right-sidebar.js-right-sidebar{ data: { "offset-top" => "101", "spy" => "affix" }, class: sidebar_gutter_collapsed_class, 'aria-live' => 'polite' }

config/webpack.config.js

@@ -18,6 +18,7 @@ var config = {
   context: path.join(ROOT_PATH, 'app/assets/javascripts'),
   entry: {
     common:               './commons/index.js',
+    common_vue:           ['vue', 'vue-resource'],
     application:          './application.js',
     blob_edit:            './blob_edit/blob_edit_bundle.js',
     boards:               './boards/boards_bundle.js',
@@ -41,7 +42,6 @@ var config = {
     users:                './users/users_bundle.js',
     lib_chart:            './lib/chart.js',
     lib_d3:               './lib/d3.js',
-    lib_vue:              './lib/vue_resource.js',
     vue_pipelines:        './vue_pipelines_index/index.js',
   },
 
@@ -98,6 +98,23 @@ var config = {
       new webpack.HashedModuleIdsPlugin() :
       new webpack.NamedModulesPlugin(),
 
+    // create cacheable common library bundle for all vue chunks
+    new webpack.optimize.CommonsChunkPlugin({
+      name: 'common_vue',
+      chunks: [
+        'boards',
+        'commit_pipelines',
+        'cycle_analytics',
+        'diff_notes',
+        'environments',
+        'environments_folder',
+        'issuable',
+        'merge_conflicts',
+        'vue_pipelines',
+      ],
+      minChunks: Infinity,
+    }),
+
     // create cacheable common library bundles
     new webpack.optimize.CommonsChunkPlugin({
       names: ['application', 'common', 'manifest'],