Javascript Vue路由器链接不渲染

我正在构建带有路由的简单Vue应用程序。但是，模板中的链接不呈现，我得到错误“无法读取未定义的属性‘name’”

我的索引文件是

import Vue from 'vue'
import App from './App'
import router from './Router'

Vue.config.productionTip = false

new Vue({
    el: '#app',
    router,
    template: '<App/>',
    components: { App }
})

App.vue是

<template>
    <div id="app" class="container">
        <div class="links">
            <router-link to="/">Map</router-link>
            <router-link to="/add">Add object</router-link>
            <a href="/">Map</a>
            <a href="/add">Add object</a>
        </div>
        <router-view></router-view>
    </div>
</template>     

<script>
    export default {
        name: 'app'
    }
</script>

地图
添加对象
导出默认值{
名称：“应用程序”
}

ShowMap组件是（AddPointOnMap现在是相同的，但名称为：“AddPointOnMap”）

导出默认值{
名称：'ShowMap'，
数据：函数（）{
返回{
map:null，
tileLayer:null，
图层：[]
}
},
挂载：函数（）{
this.initMap（）；
这个.initLayers（）；
},
方法：{
initMap（）{
this.map=L.map（'map'）.setView（[59.93863,30.31413]，14）；
this.tileLayer=L.tileLayer(
'https://cartodb-basemaps-{s} .global.ssl.fastly.net/rastertiles/voyager/{z}/{x}/{y}.png'，
{
maxZoom:18，
属性：'©；，©；'，
}
);
this.tillelayer.addTo（this.map）；
},
initLayers（）{
}
},
}
#地图{
高度：600px；
}

奇怪的是，应用程序中的路由器视图工作正常，而且如果我在索引文件中输入console.log router，它有两条路由，我添加了这两条路由。但是路由器链接元素不会渲染

---

另外，我依赖于教程。

我猜错误来自ShowMap组件。检查该组件的任何名称属性，并检查是否定义了具有该属性的对象。或者你也可以在这里发布该组件，以便我们检查。@Allkin我更新了问题：传单导入到哪里？在normalizeLocation（index.js:13083）@Badgy它没有导入，因为现在传单js只是挂在head元素中。但是贴图渲染正常并且可以工作

<template>
    <div id="app" class="container">
        <div class="links">
            <router-link to="/">Map</router-link>
            <router-link to="/add">Add object</router-link>
            <a href="/">Map</a>
            <a href="/add">Add object</a>
        </div>
        <router-view></router-view>
    </div>
</template>     

<script>
    export default {
        name: 'app'
    }
</script>

<template>
<div class="row">
    <div class="col-md-12">
        <div id="map"></div>
    </div>
  </div>  
</template>

<script>
    export default {
        name: 'ShowMap',
        data: function () {
            return {
                map: null,
                tileLayer: null,
                layers: []
            }
        },
        mounted: function() {
            this.initMap();
            this.initLayers();
        },
        methods: {
            initMap() {
                this.map = L.map('map').setView([59.93863, 30.31413], 14);

                this.tileLayer = L.tileLayer(
                'https://cartodb-basemaps-{s}.global.ssl.fastly.net/rastertiles/voyager/{z}/{x}/{y}.png',
                {
                    maxZoom: 18,
                    attribution: '&copy; <a href="http://www.openstreetmap.org/copyright">OpenStreetMap</a>, &copy; <a href="https://carto.com/attribution">CARTO</a>',
                }
                );
                this.tileLayer.addTo(this.map);
            },
            initLayers() {

            }
        },
    }
</script>

<style>
    #map {
        height: 600px;
    }
</style>