router-link перезагружает страницу
Никак не могу понять, почему не получается реализовать SPA при использовании laravel9 и vue3 По логике, станица не должна перезагружаться, а при это должны отображаться другие компоненты vue
app.js
import './bootstrap';
import router from "./router";
import Index from "./components/Index.vue";
import { createApp } from 'vue';
createApp(Index).use(router).mount('#app')
router.js
import { createRouter, createWebHistory } from "vue-router";
import TagComponent from "./components/TagComponent.vue";
const routes = [
{ path: '/posts', component: () => import('./components/PostComponent.vue') },
{ path: '/tags', component: TagComponent },
]
const router = createRouter({
history: createWebHistory(),
routes
})
export default router
Index.vue
<template>
<div>
<router-link to="/posts">Posts</router-link>
<router-link to="/tags">Tags</router-link>
<router-view></router-view>
</div>
</template>
<script>
export default {
name: "Index"
}
</script>
<style scoped>
</style>
web.php
Route::get('/', function () {
return view('welcome');
});
Auth::routes();
Route::get('/home', [App\Http\Controllers\HomeController::class, 'index'])->name('home');
Route::get('/{page}', [\App\Http\Controllers\IndexController::class, '__invoke'])->where('page', '.*');
Буду благодарен за любую подсказку, перелопатил весь интернет, не нашёл даже схожей проблемы ни у кого