Set a collection of components of VueJS for each Laravel view

I'm building a platform using Laravel 5.2 and VueJS, I already finished a first view but to start building the next one I'm facing a problem which I don't know how to set the collection of components for other view, because if I just add all my componets needed for my all views in Laravel then the app.js will be very big and I just want to load the components needed for the specific view.

This is my current structure for my landing page, the app.js file contains the following code:

import Vue from 'vue';

//Components
import Component1 from './components/landing/Component1.vue';
import Component2 from './components/landing/Component2.vue';
import Component3 from './components/landing/Component3.vue';

new Vue({
  el: '#app',
  components: {
    Component1,
    Component2,
    Component3
  }
});

And this is the blade file which I inject the vue components

@extends('layouts.public')

@section('title', 'Welcome!!')

@section('content')

  
  <component1></component1>
  <component2></component2>
  <component3></component3>
@stop

So, do you know a way to do this? Because all the guides online I read are only for one view but I will build more views for /contact, /signup, /faq, etc.

Kind regards!

via Chebli Mohamed