title: Import multiple files with a glob
body: <p>I am building a modular react app. But I am running into an issue where I can't dynamically import the routes of my app. Imagine this:</p>
  
  <p><code>app
  ├── app.js
  └── modules
      ├── module_1
      │   └── routes.js
      ├── module_2
      │   └── routes.js
      └── module_3
          └── routes.js
  </code></p>
  
  <p>Imagine all the routes.js files containing something like this:</p>
  
  <pre><code>//modules/module_*/route.js
  import React, { Fragment } from 'react';
  import { Route } from 'react-router-dom';
  
  export default () =&gt; {
      &lt;Route path="/module/path" component={ModuleComponent}&gt;
  };
  </code></pre>
  
  <p>I would then in my app.js to be able to do this:</p>
  
  <pre><code>const Routes = import('modules/**/routes.js');
  
  const App = () =&gt; (
     &lt;BrowserRouter&gt;
         &lt;Routes /&gt;
     &lt;/BrowserRouter&gt;
  );
  export default App;
  </code></pre>
  
  <p>Right now im running a separate node script that creates an index file for al the routes.js files but this is getting tedious. And i am hoping there might be a better way to do </p>