Tem como eu criar rotas em arquivos separados no VueJS?
Eu atualmente tenho essa estrutura de pasta
|- main.js
|
|- Grupos
|- grupos.vue
|- Artigos
|- artigos.vue
main.js
import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
let router = new VueRouter({
routes: [{
path: '/Main',
component: require('./mainPage.vue'),
children: [{
path: '/Main/Grupos',
component: require('./grupos.vue')
},
{
path: '/Main/Artigos',
component: require('./artigos.vue')
}
]
},
{
path: '*',
component: require('./notFound.vue')
}
]
})
const app = new Vue({router}).$mount('#container')
Eu queria saber se dá para minhas serem assim:
|- main.js
|
|- Grupos
|- grupos.vue
|- grupoRoutes.js
|- Artigos
|- artigos.vue
|- artigosRoutes.js
Eu sei que dá para fazer isso com routes.add, mas aí eu tenho que importar lá no meu Main.JS. Eu queria que fosse tudo independente. Sem ter que importar no Main.js.
Tem como eu fazer isso? Obrigado!