【Laravel】"階層化したviewにcssを適用する方法"

Laravelでviewを階層化した際、階層化していないページでは問題なくCSSが読み込めたのに階層化したページではCSSが読み込めないという問題がありました。
この問題の対処法について書いています。

環境と発生した問題

  • lalavel 9.12.2

ディレクトリ構成は以下のような感じでした。

source/     
   └public/         
        └css/  
           └style.css
   └resources/
       └views/
           └index.blade.php/
           └sample-dir/
               └error.blade.php/

views直下のindexでは正常にCSSの読み込みができていたのですが、
1つ下の階層のerror.blade.phpではstyle.cssが読み込まれませんでした。

asset関数を使ったCSSの読み込みで解決

1
2
3
4
5
6
#修正前
<link href="/css/styles.css'" rel="stylesheet" />

#修正後
<link href="{{asset('/public/css/styles.css')}}" rel="stylesheet" />
```

階層分けした場合、asset関数で指定してあげないと正しくpublic内を読みに行ってくれないようです。

Laravelドキュメント「Lalavel9.xヘルパ」2022年7月6日取得

CSS