Search code examples
vue.jslaravel-5.3vue-router

Vue 2 vue-router 2 laravel 5.3 issue


please help me with this error on console

router.map is not function

I am using browserify and laravel5.3

here is my app.js code :

import Vue from 'vue/dist/vue.js';
var VueRouter = require('vue-router');

import App from '../components/App.vue';
import Dashboard from '../components/Dashboard.vue';
import Home from '../components/Home.vue';
import Register from '../components/Register.vue';
import Signin from '../components/Signin.vue';

Vue.use(VueRouter);


export var router = new VueRouter()

router.map({
    '/': {
        name: 'home',
        component: require('../components/Home.vue')
    },
    '/register': {
        name: 'register',
        component: Register
    }
})

router.start(App, '#app');

Solution

  • vue-router 2.0, like Vue 2.0 has significant changes from v1.

    In this specific case, routes are now declared differently:

    new VueRouter({
      routes: [
        { path: '/foo', component: Foo },
        { path: '/bar', component: Bar }
      ]
    })
    

    https://router.vuejs.org/en/essentials/getting-started.html

    I strongly encourage you read up on what has changed in both.