1

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!

1 Resposta 1

0

Você pode usar o require.context do webpack veja a documentação aqui.

basicamente o seu maimRutes.js vai junta todos as esxportações default do seus arquivos .+\.route.js.

basicamente isso:


const routes = require.context('src/', true, /\.routes\.js$/)


Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .