Uncaught TypeError: Object(...) is not a function

While I am going to add Vue Router it is giving me this error and router-link is not working!

There is an Warning in Console:

[Vue warn]: Failed to resolve component: router-link 
  at <NavBar> 
  at <App>

src/router/index.js

import { VueRouter } from 'vue-router'
import Category from '../components/Category.vue';
import Post from '../components/Post.vue';


const router = new VueRouter({
    routes: [
      {
        path: '/post',
        component: Post
      }
    ]
})

export default router

main.js file:

import { createApp } from 'vue'
import App from './App.vue'
// Routes
import router from './router/index.js'

const app = createApp(App)
app.use(router);
app.mount('#app')

Navbar:

<nav class="navbar">
    <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
        <div class="navbar-nav">
          <router-link to="/" class="nav-item nav-link">Post</router-link>
          <router-link to="/category" class="nav-item nav-link">Category</router-link>
        </div>
    </div>
</nav>

What is the problem?