Pages not rendering

Hi, I'm working on my first laravel project and I'm having trouble getting my views to load. I've been trying to get this working for over a week so any help is appreciated!

Currently, when I inspect my browser, I'm getting the error Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at htp://127.0.0.1:5173/@vite/client. (Reason: CORS request did not succeed). Status code: (null). but I was getting other errors before.

app.js

createInertiaApp({
// Vite
resolve: name => {
    const pages = import.meta.glob('./Pages/**/*.vue', { eager: true })
    return pages[`./Pages/${name}.vue`]
},

setup({ el, App, props, plugin }) {
    createApp({ render: () => h(App, props) })
    .use(plugin)
    .mount(el)
    .component('inertia-link', Link)
},
});

vite.config.js

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
    plugins: [
        laravel({
            input: ['resources/css/app.css', 'resources/js/app.js'],
            refresh: true,
        }),
    ],
    server: {
        cors: true
    }
});

app.blade.php

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0" />
    @vite('resources/css/app.css','resources/js/app.js')
    @inertiaHead
</head>
<body>
    @inertia
</body>
</html>

Show.vue

<script setup>
import Layout from './Layout'
import { Head } from '@inertiajs/vue3'

defineProps({ user: Object })
</script>

<template>
<Layout>
    <Head title="Welcome" />
    <h1>Welcome</h1>
    <!-- <p>Hello {{ user.name }}, welcome to your first Inertia app!</p> -->
</Layout>
</template>

web.php

<?php

use Illuminate\Support\Facades\Route;

Route::get('/', function () {
    return inertia('Show');
});

alexwindsormusic

3 years ago

Level 4

In Show.vue, change : import Layout from './Layout' ..to this: import Layout from './Layout.vue'

(I am finding the inertia documentation quite incomplete as well.)

Please or to participate in this conversation.