Routes in separate files with VueJS

How can I create routes in separate files in VueJS? Home I currently have this folder structure

|- 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')

I wanted to know if it's possible for me to be like this:

|- main.js
|
|- Grupos
  |- grupos.vue
  |- grupoRoutes.js
|- Artigos
  |- artigos.vue
  |- artigosRoutes.js

I know you can do this with routes.add , but then I have to import there into my Main.JS . I wanted it all to be independent. Without having to import into Main.js .

How can I do this? Thanks!