Cleaner way to require multiple Vue components?
<p>I've just started working with Vue.JS and there's one small issue that's bugging me. My file structure similar to the following:</p>

<pre><code>+ js
|--+ components
|  |-- parent.vue
|  |-- child.vue
|-- main.js
</code></pre>

<p>Then in my main.js I have the following:</p>

<pre><code>window.Vue = require('vue');
require('vue-resource');
Vue.component('parent', require('./Components/parent'));
Vue.component('child', require('./Components/child'));
var app = new Vue({ el: "#app" });
</code></pre>

<p>(I'm not actually certain what <code>vue-resource</code> is, but this was set up for me by a fresh install of Laravel 5.3)</p>

<p>At a glance I immediately noticed that my main.js file was going to get unmanageable if I added too many components. I don't have this issue when working with ReactJS because main.js only needs to include the "parent" component, and the parent component includes the child component. I figured Vue.JS would have a similar trick to help me organize my components - but reading through the docs I didn't find one (maybe I missed it?)</p>

<p>Is there a way to <strong>either</strong> have a Vue component list its dependencies (for Browserify / Webpack to bundle) <strong>or</strong> recursively run a javascript statement on every file in a directory (so Browserify / Webpack just packs up the whole thing)?</p>

<p>I'm not concerned with async components at the moment - so if the solution breaks that functionality it will be okay. One day I would like to play around with using Webpack to create async components and only loading them as I need them, but today I'm more interested in just getting this up and running so I can play way Vuex.</p>