'No match found for location with path with Vue3 Router?

Using Vue3, why do I get [Vue Router warn]: No match found for location with path "/#/three" and the component does not get loaded with the following code?

var router = VueRouter.createRouter({
    history: VueRouter.createWebHistory(),
    routes: [
         { path: '/gltf',   component: Vue.defineAsyncComponent( () => import('./components/gltf.vue') ) },
         { path: '/box',    component: Vue.defineAsyncComponent( () => import('./components/box.vue') ) },
         { path: '/three',  component: Vue.defineAsyncComponent( () => import('./components/three.vue') ) },
        ],
});

Vue.createApp({
    router: router,
    data(){
       return {
       }
    },
    async mounted(){
    },
    methods: {
    },
    components: {
    },
    filters: {
    }    
})
    .use(router)
    .mount('#app')

And HTML like this:

<div id="app">
  <router-view>
  </router-view>
</div>
<script type="module" src="/app.js"></script>

There isn't even a failed attenpt at downloading the module or anything.

Why is that?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source