105 votes

Les feuilles de style et le javascript de Laravel ne se chargent pas pour les routes non basiques

Bon, je sais que c'est une question très élémentaire, mais je n'arrive pas à la résoudre. Il s'agit d'une question concernant Laravel.

En fait, mes feuilles de style sont intégrées dans ma vue de mise en page par défaut. Actuellement, je n'utilise que du css normal pour les lier, par exemple :

<link rel="stylesheet" href="css/app.css" />

Cela fonctionne très bien lorsque je me trouve sur une route à un seul niveau, par exemple /à propos mais ne fonctionne plus lorsque je vais plus loin, comme par exemple /A propos de moi .

Si je regarde la console du développeur de Chrome, je vois certaines des erreurs suivantes (uniquement pour les routes les plus profondes) :

Resource interpreted as Stylesheet but transferred with MIME type text/html: "http://example.dev/about/css/app.css".

Il est donc clair qu'il cherche maintenant les css dans le dossier "about" - qui, bien sûr, n'est pas un dossier du tout.

Je veux juste qu'il se trouve au même endroit pour les actifs, quelle que soit la route.

176voto

Chris Points 579

Pour Laravel 4 et 5 :

<link rel="stylesheet" href="{{ URL::asset('assets/css/bootstrap.min.css') }}">

URL::asset sera lié à votre project/public/ donc mettez vos scripts dedans.


Note : Pour cela, vous devez utiliser l'option " Moteur de création de modèles de lames ". Les fichiers de lames utilisent le .blade.php extension.

53voto

mXX Points 889

Laravel 4

La meilleure et la plus correcte façon de procéder

Ajout de CSS

HTML::style sera lié à votre dossier projet/public/.

{{ HTML::style('css/bootstrap.css') }}

Ajout de JS

HTML::script sera lié à votre dossier projet/public/.

{{ HTML::script('js/script.js') }}

14voto

Alexandre Danault Points 3443

Vous utilisez des chemins relatifs pour vos actifs, changez pour un chemin absolu et tout fonctionnera (ajoutez une barre oblique avant "css".

<link rel="stylesheet" href="http://stackoverflow.com/css/app.css" />

10voto

Salar Points 2553

dans Laravel 5 ,
il y a deux façons de charger un fichier js dans votre vue
Le premier utilise l'aide html, le second utilise l'aide asset.
pour utiliser html helper, vous devez d'abord installer ce paquet via la ligne de commande :

composer require illuminate/html

alors vous devez le réenregistrer, donc allez dans config/app.php, et ajoutez cette ligne dans le tableau des fournisseurs.

'Illuminate\Html\HtmlServiceProvider'

vous devez ensuite définir des alias pour votre paquet html, donc allez dans le tableau des alias dans config/app.php et ajoutez ceci

'Html'     => 'Illuminate\Html\HtmlFacade'

Maintenant, votre aide html est installée et vous pouvez écrire ceci dans vos fichiers de vue de la lame :

{!! Html::script('js/test.js') !!}

ceci cherchera votre fichier test.js dans votre projet_root/public/js/test.js.
//////////////////////////////////////////////////////////////
pour utiliser les aides d'actifs au lieu des aides html, vous devez écrire quelque chose comme ceci dans vos fichiers de vue :

<script src="{{ URL::asset('test.js') }}"></script>

ceci cherchera le fichier test.js dans project_root/resources/assets/test.js

9voto

montogeek Points 1053

Si vous utilisez Laravel 3 et que vos fichiers CSS/JS se trouvent dans le dossier public comme ceci

public/css
public/js

puis vous pouvez les appeler en utilisant des modèles in Blade comme ceci

{{ HTML::style('css/style.css'); }}
{{ HTML::script('js/jquery-1.8.2.min.js'); }}

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X