2
respostas

Glyphicon não está funcionando no Laravel 5.4

Os icones do bootstrap não estão aparecendo, estou tentando fazer a aula 04 "Parâmetros da request e URL" do curso Laravel, porém estou usando a versão 5.4, gostaria de saber se alguém tem alguma solução para esse problema, já realizei varias pesquisas e não consegui solucionar.

Verifiquei no console do navegador e aparece que o seguinte caminho não foi encontrado:

fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb:1 GET
http://localhost:8000/fonts/vendor/bootstrap-sass/bootstrap/glyphicons-halflings-regular.woff2?448c34a56d699c29117adc64c43affeb

Logo abaixo segue um simples html com o Glyphicon em uma tabela:

<!DOCTYPE html>
<html>
<head>
    <title>Listagem de Produtos</title>
    <link rel="stylesheet" type="text/css" href="/css/app.css">
</head>
<body>
<h1>Lista de Produtos</h1>

    <table class="table table-bordered">
        <tr>
            <td>Teste</td>
            <td>Teste 2</td>
            <td>
                <a href="#"><span class="glyphicon glyphicon-search" aria-hidden="true"></span></a>
            </td>
        </tr>
    </table>

</body>
</html>
2 respostas

Está usando o que pra compilar o app.css ?

Essa pasta localhost:8000/fonts/vendor/bootstrap-sass não me parece certa. O normal é localhost:8000/vendor/bootstrap-sass.

Dá uma lida aqui https://github.com/JeffreyWay/laravel-mix/issues/658

Esse problema aconteceu comigo.

Você pode baixar a fonte no site do bootstrap e colocar no projeto ou pode usar o bootstrap completo pelo cdn

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
http://getbootstrap.com/getting-started/#download