LaravelInlineAssets

backfron/laravel-finder allows you to render your JS and CSS assets inline with the rest of your HTML in production environments. This can improve the load speed of your website reducing the http requests. In fact, I wrote these package in order to improve the results of my webpages in Google PageSpeed Insights.

Installation

Via Composer

$ composer require backfron/laravel-inline-assets

Usage

Simply replace the use of asset() and mix() helpers in your blade files for the directives that this package provides.

// Instead of this
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
<script src="{{ asset('js/app.js') }}"></script>

// Write this
@inlineAsset('css/app.css')
@inlineAsset('js/app.js')

And if you are using the mix() helper:

// Instead of this
<link rel="stylesheet" href="{{ asset('css/style.css') }}">
<script src="{{ asset('js/app.js') }}"></script>

// Write this
@inlineMix('css/app.css')
@inlineMix('js/app.js')

The package will automatically creates a link or script tag if you are in non production environment (like local, devlopment, etc.). If you are in production the package gets the file contents and render it inside inline with the HTML using the appropiate tag (<style> or <script>).

If you want to customize the environments in which the asssets should be rendered inline, just publish the config file.

php artisan vendor:publish --tag=laravel-inline-assets.config

Next, add the environments that you want inside the inline key.

return [
    'inline' => [
        'production',
        'pre-production',
        'other-env',
        ... // ANY
        ... // OTHER
        ... // ENVIRONMENT
    ],
];

Change log

Please see the changelog for more information on what has changed recently.

Testing

phpunit

Contributing

Please see contributing.md for details and a todolist.

Security

If you discover any security related issues, please email author email instead of using the issue tracker.

Credits

• Jairo Ushiña
• All Contributors

License

Please see the license file for more information.