Laravel + VueJS multi vue files loading

@webpack.mix.js

mix.js('resources/assets/js/app.js', 'public/js')
.js('resources/assets/js2/app2.js', 'public/js');

 

@resources/assets/js/app.js

app.js に実装したい routing, components を読み込む
const routes = [
{ path: '/user/:id',
component: Profile,
children: [
{
path: '', component: Activity,
},

{
path: 'follow', component: Follows
},

{
path: 'activity', component: Activity
}
]
},

同一 app.js ファイル内での link は router-link で

<ul>
<li v-for="list in currentNav">
<router-link :to="list[0]" activeClass="active" v-html="list[1]" >{{ list[1] }}</router-link>
</li>
</ul>

app2.js への link は <a href="hoge"> を使ってページをリロードさせて app2.js を読み込ませる。 

 

SPAにした時のファイルの肥大化を分散して防ぐ