[autoloading] implement autoloading via modules

Currently there is a long list of modules that is autoloaded for every app. This is because a number of angular directives/filters/services are not properly required by the code that needs them and rather than attempt to track down the relationships between every part of the app and the rest autoloading just makes sure that all of the defined modules are included. Since this was implicit it caused new apps which didn't need anything but chrome styles to be really heavy.

This change makes autoloading something you opt into by requiring a ui/autoload/* module. The options include:
 - `ui/autoload/styles` - include the base styles used by Kibana. This includes all of the styles listed in the ui/styles directory.
 - `ui/autoload/directives`
 - `ui/autoload/filters`
 - `ui/autoload/modules` - include angular and several ui modules that one might expect to be loaded by default. This list is hard coded into this file.
 - `ui/autoload/all` - includes all of the above lists

In order to support this change all plugins will likely need to update and include a `ui/autoload/*` module in their public/index.js file.

src/plugins/kibana/index.js

@@ -21,20 +21,6 @@ module.exports = function (kibana) {
           'fieldFormats'
         ],
 
-        autoload: kibana.autoload.require.concat(
-          'plugins/kibana/discover',
-          'plugins/kibana/visualize',
-          'plugins/kibana/dashboard',
-          'plugins/kibana/settings',
-          'plugins/kibana/settings/sections',
-          'plugins/kibana/doc',
-          'plugins/kibana/settings/sections',
-          'ui/vislib',
-          'ui/agg_response',
-          'ui/agg_types',
-          'leaflet'
-        ),
-
         injectVars: function (server, options) {
           let config = server.config();
 

src/plugins/kibana/public/kibana.js

@@ -1,12 +1,20 @@
+// autoloading
+require('ui/autoload/all');
+
+// preloading (for faster webpack builds)
 require('plugins/kibana/discover/index');
 require('plugins/kibana/visualize/index');
 require('plugins/kibana/dashboard/index');
 require('plugins/kibana/settings/index');
-require('plugins/kibana/doc/index');
+require('plugins/kibana/settings/sections');
+require('plugins/kibana/doc');
+require('ui/vislib');
+require('ui/agg_response');
+require('ui/agg_types');
 require('ui/timepicker');
+require('leaflet');
 
 var moment = require('moment-timezone');
-
 var chrome = require('ui/chrome');
 var routes = require('ui/routes');
 var modules = require('ui/modules');

src/plugins/statusPage/index.js

@@ -5,13 +5,7 @@ module.exports = function (kibana) {
         title: 'Server Status',
         main: 'plugins/statusPage/statusPage',
         hidden: true,
-        url: '/status',
-
-        autoload: [].concat(
-          kibana.autoload.styles,
-          'ui/chrome',
-          'angular'
-        )
+        url: '/status'
       }
     }
   });

src/plugins/statusPage/public/statusPage.js

@@ -2,6 +2,7 @@ var $ = require('jquery');
 var _ = require('lodash');
 var notify = require('ui/notify');
 
+require('ui/autoload/styles');
 require('plugins/statusPage/statusPageMetric');
 require('plugins/statusPage/statusPage.less');
 

src/server/plugins/PluginApi.js

@@ -7,11 +7,25 @@ module.exports = class PluginApi {
     this.config = kibana.config;
     this.rootDir = kibana.rootDir;
     this.package = require(join(pluginPath, 'package.json'));
-    this.autoload = require('../../ui/autoload');
     this.Plugin = Plugin.scoped(kibana, pluginPath, this.package);
   }
 
   get uiExports() {
     throw new Error('plugin.uiExports is not defined until initialize phase');
   }
+
+  get autoload() {
+    console.warn(
+      `${this.package.id} accessed the autoload lists which are no longer available via the Plugin API.` +
+      'Use the `ui/autoload/*` modules instead.'
+    );
+
+    return {
+      directives: [],
+      filters: [],
+      styles: [],
+      modules: [],
+      require: []
+    };
+  }
 };

src/ui/UiApp.js

@@ -1,6 +1,5 @@
 var _ = require('lodash');
 var { join } = require('path');
-var autoload = require('./autoload');
 
 class UiApp {
   constructor(uiExports, spec) {
@@ -17,10 +16,16 @@ class UiApp {
     this.description = this.spec.description;
     this.icon = this.spec.icon;
     this.hidden = this.spec.hidden;
-    this.autoloadOverrides = this.spec.autoload;
     this.templateName = this.spec.templateName || 'ui_app';
     this.url = `${spec.urlBasePath || ''}${this.spec.url || `/app/${this.id}`}`;
 
+    if (this.spec.autoload) {
+      console.warn(
+        `"autoload" (used by ${this.id} app) is no longer a valid app configuration directive.` +
+        'Use the \`ui/autoload/*\` modules instead.'
+      );
+    }
+
     // once this resolves, no reason to run it again
     this.getModules = _.once(this.getModules);
 
@@ -30,7 +35,6 @@ class UiApp {
 
   getModules() {
     return _.chain([
-      this.autoloadOverrides || autoload.require,
       this.uiExports.find(_.get(this, 'spec.uses', [])),
       this.uiExports.find(['chromeNavControls']),
     ])

src/ui/appEntryTemplate.js

@@ -20,7 +20,7 @@ ${pluginSlug}
  *
  */
 
-require('ui/chrome')
+require('ui/chrome');
 ${requires}
 require('ui/chrome').bootstrap(/* xoxo */);
 

src/ui/public/autoload/all.js

@@ -0,0 +1,4 @@
+require('./modules');
+require('./directives');
+require('./filters');
+require('./styles');

src/ui/public/autoload/directives.js

@@ -0,0 +1,2 @@
+const context = require.context('../directives', false, /[\/\\](?!\.|_)[^\/\\]+\.js/);
+context.keys().forEach(key => context(key));

src/ui/public/autoload/filters.js

@@ -0,0 +1,2 @@
+const context = require.context('../filters', false, /[\/\\](?!\.|_)[^\/\\]+\.js/);
+context.keys().forEach(key => context(key));

src/ui/public/autoload/modules.js

@@ -0,0 +1,34 @@
+require('angular');
+require('ui/chrome');
+require('ui/chrome/context');
+require('ui/bind');
+require('ui/bound_to_config_obj');
+require('ui/config');
+require('ui/courier');
+require('ui/debounce');
+require('ui/doc_title');
+require('ui/elastic_textarea');
+require('ui/es');
+require('ui/events');
+require('ui/fancy_forms');
+require('ui/filter_bar');
+require('ui/filter_manager');
+require('ui/index_patterns');
+require('ui/listen');
+require('ui/notify');
+require('ui/parse_query');
+require('ui/persisted_log');
+require('ui/private');
+require('ui/promises');
+require('ui/safe_confirm');
+require('ui/state_management/app_state');
+require('ui/state_management/global_state');
+require('ui/storage');
+require('ui/stringify/register');
+require('ui/styleCompile');
+require('ui/timefilter');
+require('ui/tooltip');
+require('ui/typeahead');
+require('ui/url');
+require('ui/validateDateInterval');
+require('ui/watch_multi');

src/ui/public/autoload/styles.js

@@ -0,0 +1,2 @@
+const context = require.context('../styles', false, /[\/\\](?!mixins|variables|_|\.)[^\/\\]+\.less/);
+context.keys().forEach(key => context(key));