Getting View [app] not found error in my Inertia laravel app

I

3

6

I'm trying to use inertia in my laravel app. My app doesn't need jetstream so I won't be using that. So I went to inertia's site https://inertiajs.com/ to install it, but I'm not sure if I'm doing it correctly.

The error I get on my page is

View [app] not found.

This is what I have in my ProductController

public function index()
{
    return Inertia::render('components/products/Index');
}

This is my Index.vue

<template>
    <div>
        <h1>Welcome</h1>
        <p>Hello, welcome to your first Inertia app!</p>
    </div>
</template>

<script>
    export default {
        components: {

        },
        props: {

        },
    }
</script>

and in my app.blade.php

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="x-ua-compatible" content="ie=edge">

    <title>Admin</title>

    <link rel="stylesheet" href="/vendor/adminlte/plugins/fontawesome-free/css/all.min.css">
    <link rel="stylesheet" href="/css/style.css">

</head>
<body class="hold-transition sidebar-mini">
    <div class="wrapper">

    <!-- Navbar -->
    <nav class="main-header navbar navbar-expand navbar-white navbar-light">

        <!-- Left navbar links -->
        <ul class="navbar-nav">
            <li class="nav-item">
                <a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
            </li>
            <li class="nav-item d-none d-sm-inline-block">
                <a href="index3.html" class="nav-link">Home</a>
            </li>
            <li class="nav-item d-none d-sm-inline-block">
                <a href="#" class="nav-link">Contact</a>
            </li>
        </ul>

        <!-- Right navbar links -->
        <ul class="navbar-nav ml-auto">

            <li class="nav-item dropdown user-menu">
                <a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown"><span>{{ Auth::user()->name }}</span></a>
                <ul class="dropdown-menu dropdown-menu-lg dropdown-menu-right">
                    <li class="user-header bg-primary h-auto">
                        <p class="mt-0"><span>{{ Auth::user()->name }}</span><small><span>{{ Auth::user()->title }}</span></small></p>
                    </li>
                    <li class="user-footer">
                        <a class="btn btn-default btn-flat float-right btn-block" href="#" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">
                            <i class="fa fa-fw fa-power-off"></i> Log Out
                        </a>

                        <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                            @csrf
                        </form>
                    </li>
                </ul>
            </li>

        </ul>
    </nav>
    <!-- /.navbar -->

    <aside class="main-sidebar elevation-4">
        <a href="{{ route('home') }}" class="brand-link">
            <img src="/img/default-brand.png" class="brand-image img-circle elevation-3"
             style="opacity: .8">
        </a>
    </aside>

    <div class="content-wrapper">
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0 text-dark">@yield('title')</h1>
                    </div>
                </div>
            </div>
        </div>

        <div class="content">
            <div class="container-fluid">
                @inertia
            </div>
        </div>
    </div>
</div>


<script src="/jquery/jquery.min.js"></script>
<script type="text/javascript" src="{{ mix('js/app.js') }}"></script>
</body>
</html>

I'm not sure if I'm missing anything else.

Increase answered 22/12, 2020 at 14:54 Comment(1)

can you add some more info about your server-side setup? Where is your app.blade.php located? How is the middleware configurated? Custom root template configured? – Lineament 24/12, 2020 at 14:48

N

16

Inertia allows you to set your application root view from the HandleInertiaRequests middleware

protected $rootView = 'layout/app';

make sure it corresponds with your folder arrangement under views/

in this case it should be views/layout/app.blade.php

Neumann answered 25/4, 2021 at 14:6 Comment(0)

M

2

you can also change the app.blade.php directory if you want by going to inertia middleware file located at: app\Http\Middleware\HandleInertiaRequests.php and change the app file directory to wherever you want:

protected $rootView = '/layouts/app';

Memento answered 19/3, 2022 at 15:37 Comment(0)

S

-2

app is not found in view directory. Try this.

Route::get('/', function () {
    return view('layouts/app');
});

Stapler answered 23/5, 2021 at 8:10 Comment(0)

Recommended topics

Hot tags