|
| 1 | +# laravel-elixir-sri |
| 2 | + |
| 3 | +[](https://npmjs.org/package/laravel-elixir-sri) [](https://npmjs.org/package/laravel-elixir-sri) |
| 4 | + |
| 5 | +Generate [Subresource Integrity (SRI)](https://www.w3.org/TR/SRI/) hashes in your Laravel Elixir asset pipeline. |
| 6 | + |
| 7 | +## Install |
| 8 | + |
| 9 | +``` |
| 10 | +npm install laravel-elixir-sri --save-dev |
| 11 | +``` |
| 12 | + |
| 13 | +or |
| 14 | + |
| 15 | +``` |
| 16 | +yarn add laravel-elixir-sri --dev |
| 17 | +``` |
| 18 | + |
| 19 | +## Usage within Laravel Elixir |
| 20 | + |
| 21 | +### Example Gulpfile: |
| 22 | + |
| 23 | +```javascript |
| 24 | +var elixir = require('laravel-elixir'); |
| 25 | + |
| 26 | +require('laravel-elixir-sri'); |
| 27 | + |
| 28 | +elixir(function (mix) { |
| 29 | + mix.sri([ |
| 30 | + 'css/app.css', |
| 31 | + 'js/app.js' |
| 32 | + ]); |
| 33 | +}); |
| 34 | +``` |
| 35 | + |
| 36 | +This will generate hashes for the given files stored in your **public folder** and save them to a `/public/sri.json` file. |
| 37 | + |
| 38 | +### Changing the output folder: |
| 39 | + |
| 40 | +You can specify a different output folder in the second argument: |
| 41 | + |
| 42 | +```javascript |
| 43 | +// Save sri.json to /public/assets |
| 44 | +mix.sri('css/app.css', '/public/assets'); |
| 45 | +``` |
| 46 | + |
| 47 | +### Parameters: |
| 48 | + |
| 49 | +If you wish to customize more options, you can pass them as an object in the third argument: |
| 50 | + |
| 51 | +```javascript |
| 52 | +// Use sha512 algorithm |
| 53 | +mix.sri('js/app.js', null, { |
| 54 | + algorithms: ['sha512'] |
| 55 | +}); |
| 56 | +``` |
| 57 | +You can find all the available parameters on `gulp-sri`'s [documentation](https://www.npmjs.com/package/gulp-sri#parameters). |
| 58 | + |
| 59 | +## Usage within Laravel views |
| 60 | + |
| 61 | +First, you need to require the [laravel-sri]('https://github.com/sebdesign/laravel-sri') package in your `composer.json`. |
| 62 | + |
| 63 | +To reference the generated hashes from the `sri.json` in your views, you may use the `integrity` helper function with the name of the file you are using in your `elixir` or `asset` function. |
| 64 | + |
| 65 | +As a fallback, if the given file is not found in the `sri.json`, **it will generate the appropriate hashes on the fly** for your convenience. Read more on the [laravel-sri]('https://github.com/sebdesign/laravel-sri') repository. |
| 66 | + |
| 67 | +```php |
| 68 | +{{-- Use with elixir() function --}} |
| 69 | +<link rel="stylesheet" href="{{ elixir('css/app.css') }}" integrity="{{ integrity('css/app.css') }}" crossorigin="anonymous"> |
| 70 | + |
| 71 | +{{-- Use with asset() function --}} |
| 72 | +<script src="{{ asset('js/app.js') }}" integrity="{{ integrity('js/app.js') }}" crossorigin="anonymous"></script> |
| 73 | +``` |
0 commit comments