如何使用@vitejs/plugin-vue插件设置laravel-vue项目

jqjz2hbq  于 2023-02-14  发布在  其他
关注(0)|答案(1)|浏览(191)

我已经设置了laravel项目与vuejs使用@vitejs/plugin-vue插件,我面临的问题是如何管理客户端(vue 3)和后端(laravel 9)之间的端点.
当第一次点击注册时,它返回注册。vue x1c 0d1x
页面刷新时返回404错误。

欢迎使用.blade.php

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">

        <title>Laravel</title>

        <!-- Fonts -->
        <link href="https://fonts.bunny.net/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">

        @vite(['resources/js/app.js','resources/css/app.css'])
    </head>
    <body class="antialiased">
        <div id="app"></div>
    </body>
</html>

应用程序版本

<template>

    <header>
        <!--    load navbar here -->
        <nav>
            <RouterLink to="/register">Register</RouterLink>
            <RouterLink to="/">Home</RouterLink>
        </nav>
    </header>

    <main>
        
        <RouterView/>

    </main>

</template>

路由器.js

import {createRouter, createWebHistory} from "vue-router";
import Register  from "../components/Register.vue";
import App  from "../../views/App.vue";

const router = createRouter({
    history: createWebHistory(),
    routes: [
        {
            path: '/',
            name: 'app',
            component: App
        },{
            path: '/register',
            name: 'register',
            component: Register
        }
    ]
})
export default router
lsmepo6l

lsmepo6l1#

快速修复。在routes/web.php

Route::get('/{any}', function () {
  return view('welcome');
})->where("any",".*");

see here

相关问题