<commit_before># Assets
Assets provides a simple way to work with assets within Grind.  It’s designed to get out of your way and allow you to work without worrying about running a watch command and waiting for files to compile.

Once setup, all you need to do is store your assets in `resources/assets` and the package will automatically detect changes and compile (and cache) on page load.

[[toc]]

## Installation
First, add the `grind-assets` package via your preferred package manager:

```shell
npm install --save grind-assets
```

Next, you’ll need to add `AssetsProvider` to your app providers in `app/Boostrap.js`:

```js
import Grind from 'grind-framework'
import { AssetsProvider } from 'grind-assets'

const app = new Grind()
app.providers.push(AssetsProvider)
```

### Dependencies
Assets comes with built in support for numerous asset types, however in order to maintain flexibility and minimize package bloat, it doesn’t explicitly require any compiler depenencies.  Instead you can pick and choose which you want to use, and install them directly.

Refer to the table below determine which dependencies you’ll need:

| Compiler | Install Command | Description |
| -------- | --------------- | ----------- |
| Babel | `npm install --save-dev babelify browserify` | Provides support for using ES6/7 features in the browser |
| SCSS | `npm install --save-dev node-sass` | Provides SCSS compilation |
| Javascript | `npm install --save-dev uglify-js` | Provides JS minificaiton |
| CSS | `npm install --save-dev clean-css` | Provides CSS minification |
| SVG | `npm install --save-dev svgo` | Provides SVG optimization |

> {tip} Don’t worry if you forget to setup a dependency, Assets will let you know what to install if you try to use a compiler that doesn’t have it’s dependencies installed.

## Compilers vs Post Processors

Grind Assets is built around two types: **Compilers** and **Post Processors**.

**Compilers** run first, they’re used to compile (or transpile), files from a feature rich, high level languages such as SCSS or ES6 to a more primitive language that the browser supports, like CSS and Javascript.
<commit_msg>Added autoprefixer to list of assets dependencies<commit_after># Assets
Assets provides a simple way to work with assets within Grind.  It’s designed to get out of your way and allow you to work without worrying about running a watch command and waiting for files to compile.

Once setup, all you need to do is store your assets in `resources/assets` and the package will automatically detect changes and compile (and cache) on page load.

[[toc]]

## Installation
First, add the `grind-assets` package via your preferred package manager:

```shell
npm install --save grind-assets
```

Next, you’ll need to add `AssetsProvider` to your app providers in `app/Boostrap.js`:

```js
import Grind from 'grind-framework'
import { AssetsProvider } from 'grind-assets'

const app = new Grind()
app.providers.push(AssetsProvider)
```

### Dependencies
Assets comes with built in support for numerous asset types, however in order to maintain flexibility and minimize package bloat, it doesn’t explicitly require any compiler depenencies.  Instead you can pick and choose which you want to use, and install them directly.

Refer to the table below determine which dependencies you’ll need:

| Compiler | Install Command | Description |
| -------- | --------------- | ----------- |
| Babel | `npm install --save-dev babelify browserify` | Provides support for using ES6/7 features in the browser |
| SCSS | `npm install --save-dev node-sass` | Provides SCSS compilation |
| Javascript | `npm install --save-dev uglify-js` | Provides JS minificaiton |
| CSS | `npm install --save-dev clean-css autoprefixer` | Provides CSS minification and autoprefixing |
| SVG | `npm install --save-dev svgo` | Provides SVG optimization |

> {tip} Don’t worry if you forget to setup a dependency, Assets will let you know what to install if you try to use a compiler that doesn’t have it’s dependencies installed.

## Compilers vs Post Processors

Grind Assets is built around two types: **Compilers** and **Post Processors**.

**Compilers** run first, they’re used to compile (or transpile), files from a feature rich, high level languages such as SCSS or ES6 to a more primitive language that the browser supports, like CSS and Javascript.

{'fraction_non_alphanumeric': 0.09076323630529452, 'fraction_numerical': 0.0013752005500802201, 'mean_word_length': 4.110070257611241, 'pattern_counts': {'":': 0, '<': 3, '<?xml version=': 0, '>': 5, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4981904', 'n_tokens_mistral': 1191, 'n_tokens_neox': 1153, 'n_words': 597}