Issue with route in Laravel; my page does not access the bootstrap files that are on the layout page

Asked

Viewed 337 times

1

I would like a little strength, I am starting with Laravel 6 and I have the following problem;

I have a layout page inside the "views>layouts" folder called "admin.blade.php":

Página de Layout do módulo admin

On it are my bootstrap and jQuery files and etc. Page "admin.blade.php":

<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <!-- Adcionando dependencias -->
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>

    <title> @yield('title') </title>
</head>
<header >

 <!-- Menu da página --> 

</header>
<body>

    <div class="container">
        @yield('content')
    </div>

</body>
<footer>

 <!-- Rodapé da página --> 

</footer>
</html>

Here are my routes:

//Admin
Route::get('/admin', 'AdminController@index');
Route::get('/admin/usuarios', 'UsuariosController@index');

Routes direct to the controller that directs to the appropriate files. When I access the index page of the admin module within "views>admin>index.blade.php" extending the layout page:

@extends('layouts.admin')

@section('title')
    Index
@endsection

@section('content')

<!-- Corpo da página -->

@endsection

In Google Chrome features the bootstrap file search directory is:

inserir a descrição da imagem aqui

This way I can access the bootstrap files and everything goes well, but when I try to access the index of users of the admin module, in the following directory "views>admin>usuarios>index.blade.php", extending in the same way the admin layout page, the bootstrap file search directory is being:

inserir a descrição da imagem aqui

With this "admin" in the middle of the Request Url, this way I can no longer access the bootstrap files and the page loses styling.

I’d like to know what this problem is about and how to solve it. From now on hugs! ;)

1 answer

0


Try calling the bootstrap and jquery files using a helper called Asset:

<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <!-- Adcionando dependencias -->

    <!-- CSS -->
    <link rel="stylesheet" href="{{ asset('css/app.css') }}">

    <!-- JS-->
    <script src="{{ asset('js/app.js') }}"></script>

    <title> @yield('title') </title>
</head>
<header >

 <!-- Menu da página --> 

</header>
<body>

    <div class="container">
        @yield('content')
    </div>

</body>
<footer>

 <!-- Rodapé da página --> 

</footer>
</html>

Browser other questions tagged

You are not signed in. Login or sign up in order to post.