<router-view> and <router-link> do not work

#1

Hi, could you analyze my code ? I cannot see the errors.
The router-view do not load the Component Login.vue

main.ts

import { createApp } from 'vue'
import App from './App.vue'
import 'bootstrap/dist/css/bootstrap.min.css';
import router from "./router";

createApp(App)
    .use(router)
    .mount('#app')

index.ts

import {createRouter, createWebHashHistory} from "vue-router";
import Login from '../views/Login.vue'

const routes =[{
    path: '/login',
    name: 'Login',
    component: Login
}]

const router = createRouter({
    history: createWebHashHistory(),
    routes: routes
})

export default router;

Login.vue

<template>
  <h1>Login</h1>
</template>

<script>
export default {
  name: "LoginA"
}
</script>

<style scoped>

</style>

App.vue

<template>
  <router-view id="login">
  </router-view>
</template>

<script>

export default {
  name: 'App',
  components: {
  }
}
</script> ```

I'm still learning, then I'm sorry.
#2

The code provided is currently not properly formatted for this forum. In its current state it’s illegible which makes it hard for people to help you.

Please read the following guide about how to properly format code and then edit your topic accordingly.

Thanks!

#3

Thank you very much ! I did it.

#4

I found the mistake. That was with vue.esm-bundler at main.ts.
instead of:
import { createApp } from 'vue'

Must
import { createApp } from 'vue/dist/vue.esm-bundler'