When I used router in Vuejs 2 it showed blank page - vue.js

Question

I'm asking for help. I use vuejs to make my application.however when using the router it returned me a blank page.
main.js
import Vue from 'vue'
import App from './App.vue'
import 'bootstrap'
import 'bootstrap-vue'
import router from './router'
Vue.config.productionTip = false
new Vue({
router,
render: h => h(App),
}).$mount('#app')
router/index.js
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home'
Vue.use(VueRouter)
const routes = [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
},
]
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
export default router
views/Home/index.vue
<template>
<div>
<Partner />
</div>
</template>
<script>
import Partner from '../../components/partner.vue'
export default {
name: "Home",
components:{
Partner
}
}
</script>
<style>
</style>
And this is my app.vue file
<template>
<div id="app">
<div class="header">
<div class="container1">
<img src="./assets/logo.svg" />
<ul class="menu">
<li>Về chúng tôi</li>
<li>Sản phẩm</li>
<li>Đội ngũ</li>
<li>Giải thưởng</li>
<li>Đầu tư</li>
<li>Đối tác</li>
<li>Tin tức</li>
<li>Tuyển dụng</li>
<li>Liên hệ</li>
</ul>
<div class="nav-item dropdown" id="language">
<a class="nav-link " href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown"
aria-expanded="false">
<img src="./assets/flag-vietnam.svg" alt="">
<b class="ml-2">VN</b>
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
<a class="language-Viet row" href="#">
<div class="language-popup">
<img src="./assets/flag-vietnam.svg" alt="">
<b class="ml-2">Tiếng Việt</b>
</div>
</a>
<a class="language-English row" href="#">
<div class="language-popup">
<img src="./assets/image 19.svg" alt="">
<b class="ml-2">English</b>
</div>
</a>
</div>
</div>
</div>
</div>
<Carousel />
<div class="clear"></div>
<router-view/>
</div>
</template>
<script>
import './assets/reset.css';
import './assets/grid.css';
import './assets/boostrap.css'
import Carousel from './components/Carousel.vue'
export default {
name: 'App',
components: { Carousel
},
}
</script>
Once I compile, I have no errors but a blank page.
Thanks for any help. I tried without the router view, I manage to launch the index.html once compiled for production and I have a rendering.