Uncaught Error: [vue-router] “path” is required in a route configuration when exporting imports

Question

Please note:

The Index/Search/Features are the exact same code, with different names, all three have a path, component, name and meta like the one supplied below.

notes/routes/routes.js

import Index from './index'
import Search from './search'
import Features from './features'

export default {
    Index,
    Search,
    Features
}

notes/routes/index.js

import Index from '../components/index'

export default {
    name: 'notes.index',
    path: '/notes',
    component: Index,
    meta: {
        title: `Manage notes - Sort`,
    }
}

router.js

import Vue from 'vue'
import Router from 'vue-router'
import NoteRoutes from '@notes/routes/routes'

Vue.use(Router)

const routes = Array.prototype.concat(
    NoteRoutes,
);

const router = new Router({
    mode: 'history',
    routes
});

I am concatenating all of my route.js files from each module, and then applying them to the Router, but I am still getting the error:

Uncaught Error: [vue-router] "path" is required in a route configuration.

Even though all my routes have a path. If I import a route file, let's say index.js directly it works, but not when using my routes.js which is just an exporter for all my routes for that module. What am I missing here?

eli chen eli chen · Accepted Answer · 2019-07-04T17:25:58

you should do it like this

notes/routes/routes.js

import Index from './index'
import Search from './search'
import Features from './features'

export default [
    Index,
    Search,
    Features
]

routes.js

import Vue from 'vue'
import Router from 'vue-router'
import routes from '@notes/routes/routes'

Vue.use(Router)



const router = new Router({
    mode: 'history',
    routes
});

the way you did it. you actually get array with one item which contains all the routes object

Uncaught Error: [vue-router] “path” is required in a route configuration when exporting imports

1 Answers