laravel-elixir-base64/README.md

A small helper to inline images as base64 for Laravel Elixir

# Laravel Elixir Base64
A small helper to inline images as base64 for Laravel Elixir.

# Installation & Setup
First, install laravel-elixir-base64 as a development dependency:

```bash
npm install --save-dev laravel-elixir-base64
```

Create a images folder in your assets folder `resources/assets/images`. The script will by default check in this folder for images that are enabled for base64 inlining in your css files. 

Now you are ready for using it in your gulpfile.js, add a new mixin to it like following

```js
elixir(function(mix) {
    mix.inlineBase64('app.css', 'compiled.css');
});

```

# Configuration
This plugin offers a few configuration settings, that can be set as thirth argument The syntax is as following:

```
    mix.inlineBase64(Src, Filename, Options);
```

Argument | Description
-------- | -----------
Src | The css file that needs optimizing, by default it will prefix the given filename with the elixir cssOutput directory what is by default `/public/css/` You can also use a wildcard to scan all CSS files inside the css folder `*.css` or `**/*.css`.
Filename | The filename where the optimized sourcefile should be written to. By default this would be named `optimized.css` and also stored at the elixir cssOutput configuration setting.

The `Options` argument is optional and contains the following settings:

Value | Default
----- | -------
baseDir | elixir.config.assetsDir + "images/" (resources/assets/)
maxSize | 14 * 1024
debug | false

# Watchers
When doing a gulp watch the plugin will hook into laravel elixir and registers watchers for your src files or the baseDir(resources/assets/images) and runs the base64 inliner again when it detects some changes.

# Force asset injection
In your css file, just add ",true" to the image url : it will force the asset to be injected in base64 in css file, event if the maxSize is reached.

```css
div.logo {
    background: transparent url(/img/logo.png,true) no-repeat center center;
}
```

This package makes is a wrapper for Laravel for the gulp-inline-base64 module. https://www.npmjs.com/package/gulp-inline-base64.