vue-routerでトランジションを使用しようとすると "指示の解決に失敗しました：遷移"

私はvue-routerを使っているvueアプリを持っています。vue-routerでトランジションを使用しようとすると "指示の解決に失敗しました：遷移"

import Vue from 'vue' 
import VueRouter from 'vue-router' 

Vue.use(VueRouter) 
let router = new VueRouter() 

// Components 
import App from './App.vue' 

import Mapper from './components/Mapper/mapper.vue' 
import ToDos from './components/Todos/ToDoApp.vue' 
import Punchlist from './components/Punchlist/punchlist.vue' 

// Transitions 
Vue.transition('slide',{ 
    enterClass: 'slideInRight', 
    leaveClass: 'slideOutRight' 
}) 


// Redirects 
router.redirect({ 
    '*': 'punchlist' 
}) 

// Mappings 
router.map({ 
    '/mapper': { 
     component: Mapper 
    }, 
    '/todos': { 
     component: ToDos 
    }, 
    '/punchlist': { 
     component: Punchlist 
    } 
}) 

router.start(App, '#app')

私はルート間を移動するときに使用したいslide呼ば登録された特定の遷移を有します。私はそれを実行しようとすると

<template> 
    <div class="container"> 
    <h1>Component Gallery</h1> 
     <p> 
     <a class='btn btn-primary' v-link="{ path: '/punchlist' }">Punchlist</a> 
     <a class='btn btn-primary' v-link="{ path: '/todos' }">Todos</a> 
     <a class='btn btn-primary' v-link="{ path: '/mapper' }">Mapper</a> 
     </p> 
     <router-view v-transition="slide" transition-mode="out-in" :google-maps-api-key="googleMapsApiKey"></router-view> 
    </div> 
</template>

、私はコンソールのエラーを取得：