Requiring metadata with webpack

app_finder.diff

import _ from 'underscore';
import Backbone from 'backbone';

- // all the routes from the mini-apps
- const custom_apps_routes = {
-   about: {
-     'about': 'about',
-   },
-   heavy: {
-     'heavy(/:heavy_param)': 'heavy',
-   }
- };

+ const custom_apps_registry = {};
+ const custom_apps_routes = {};
+ const custom_apps_context = require.context('./apps', true, /metadata\.js$/);

+ // Creating the index of metadata which holds {app_name: {metadata}} pairs.
+ custom_apps_context.keys().reduce((collector, routes_file) => {
+   const app_metadata = custom_apps_context(routes_file).default;
+   collector[app_metadata.name] = app_metadata;
+   return collector;
+ }, custom_apps_registry);

// we need to convert Backbone routes to plain RegExps
function routeToRegExp(route) {
  return Backbone.Router.prototype._routeToRegExp.call(null, route);
}

// Creating the index of routes' regexes
- _.each(custom_apps_routes, (value, key) => {
+ _.each(custom_apps_registry, (value, key) => {
- custom_apps_routes[key] = Object.keys(value).map(routeToRegExp);
+ custom_apps_routes[key] = Object.keys(value.routes).map(routeToRegExp);
});

export default path => {
  const matcher = route => route.test(path);
- return _.findKey(custom_apps_routes, routes => _.some(routes, matcher))  
+ const app_name = _.findKey(custom_apps_routes, routes => _.some(routes, matcher));
+ return custom_apps_registry[app_name];
}

router.diff

import Backbone from 'backbone';
import $ from 'jquery';

import AppFinder from './app_finder';

export default Backbone.Router.extend({
  routes: {
    '': 'home',
    'main_app_part': 'mainAppPart',
    '*handleMissingRoute': 'handle404'
  },

  home() {
    $('#app').html("You're on the home page");
  },

  mainAppPart() {
    $('#app').html("You're viewing part of the main app, no async bundle loading here");
  },

  handle404(path) {
-   const mini_app_name = AppFinder(path);
+   const mini_app = AppFinder(path);

-   if (mini_app_name) {
+   if (mini_app) {
-     const handler = require('bundle!./apps/' + mini_app_name + '/index.js');
+     const handler = require('bundle!./apps/' + mini_app.name + '/index.js');

      handler(bundle => {
        const App = bundle.default;
        App();
        Backbone.history.loadUrl();
      });
    } else {
      alert('404');
    }
  },
});