Error : vue Maximum call stack size exceeded - vue.js

Question

i'm building an app, i tried to do router for login page but it give me this error :
vue.runtime.esm.js?2b0e:4484 Uncaught RangeError: Maximum call stack size exceeded, is there anything i did wrong
thank you for your help hopefully u can give me a hint on how to fix it
this is the Login Components
<template>
<div class="hello">
Login
</div>
</template>
<script>
export default {
name: '',
props: {
msg: String
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
Home Components
<template>
<div class="hello">
<header class="globalNav noDropdownTransition">
<div class="container-lg">
<ul class="navRoot">
<li class="navSection logo">
<a class="rootLink item-home colorize" href="/"><h1>Charity Finder</h1></a>
</li>
<li class="navSection primary">
<a class="rootLink item-products hasDropdown colorize" data-dropdown="products">
Products
</a>
<a class="rootLink item-developers hasDropdown colorize" data-dropdown="developers">
Developers
</a>
<a class="rootLink item-company hasDropdown colorize" data-dropdown="company">
Company
</a>
</li>
<li class="navSection secondary">
<a class="rootLink item-support colorize" href="">
Support
</a>
<router-link class="rootLink item-dashboard colorize" to="/login"> Sign in</router-link>
</li>
</ul>
</div>
</header>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
props: {
msg: String
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>
This the router Router
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import Login from '../views/Login.vue'
Vue.use(VueRouter)
const routes = [
{
path: '/',
name: 'home',
component: Home
},
{
path: '/login',
name: 'login',
component: Login
}
]
const router = new VueRouter({
routes
})
export default router