component-example with one Vue instance per component

component-example

import Vue from 'vue'
import Main from './main.vue';
import Locations from './components/Locations.vue';
import NewLocation from './components/NewLocation.vue';
import EditLocation from './components/EditLocation.vue';
import ShowLocation from './components/ShowLocation.vue';
import FilterLocation from './components/FilterLocation.vue';

const VueResource = require('vue-resource');
Vue.use(VueResource);

const VueRouter = require('vue-router')
Vue.use(VueRouter);

// Prefix End-point with Laravel API
Vue.http.options.root = '/api/1.0';

var LocationRoot = Vue.extend({
    template : '<div><main></main></div>',
    data () {
        return {
            template : '#location-list',
            resource : this.$resource('location{/id}')
        }
    },

    components : {
        Main
    }
});

var router = new VueRouter();

router.map({
    '/': {
        component: Locations
    },
    '/:hashid/show': {
        name: 'show',
        component: ShowLocation
    },
    '/:hashid/edit': {
        name: 'edit',
        component: EditLocation
    },
    '/add/': {
        name: 'add',
        component: NewLocation
    },
    '/filter/': {
        name: 'filter',
        component: FilterLocation
    }
});

router.start(LocationRoot, '#mtw-location');