LoginSignup
2
3

More than 5 years have passed since last update.

LaravelでインラインCSS

Posted at

PageSpeed Insightsの点数を上げるだけならインラインCSS化が一番効く。
HTTP/2 Server Pushの時代に意味があるかはともかく。(Server Pushの話はどこかに書いた)
どちらがいいかを試すためにインラインCSSもできるようにしておく。

@inline_css('css/app.css')みたいに使えるようにBladeで拡張すればいいと思って作りかけたけど
https://readouble.com/laravel/5.6/ja/blade.html#extending-blade

        Blade::directive('inline_css', function ($path) {
            $css = File::get(public_path(trim($path, "'")));

            return '<style type="text/css">' . $css . '</style>';
        });

作ってる途中で$pathに'が含まれてることに気付く。'css/app.css'で渡される。
そういう仕様?

Blade拡張を集めたパッケージを調べたらそれでも'を削除してた。仕様だ。
https://github.com/appstract/laravel-blade-directives/blob/47424072001279063e69fd117e4fe1c1e4e5ce2d/src/DirectivesRepository.php#L35

そしてここで@inlineがあるのに気付く。自分で作らなくてもこれ使えばいい。
https://github.com/appstract/laravel-blade-directives#inline
@inline('css/app.css')

2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3