What is an Asset Pipeline?

An Asset Pipeline is a concept where a developer simply places their resources into folders, and the application handles including those as needed. The first time I’d ever played with it was when I was working with Rails 4, and it was the coolest thing ever. In normal web design, you have to add all your resources into the source code yourself; if you have 4 different CSS stylesheets and 2 JavaScript files, then you’re going to need a total of 6 “link” and “script” tags, and on top of that, you’ll need to make sure your paths are correct.

Wouldn’t it be cool if you could just drop those resources into a folder and have that folder’s contents automatically added to your templates? Just think about it: you wouldn’t have to worry about pathing ever again! That alone is worth it, but as if that’s not enough, here’s some other stuff that an Asset Pipeline will do for you:

1. Preprocessing – Want to use SCSS or CoffeeScript? Well, go ahead.
2. Minification – A pipeline could be configured to concatenate and minify scripts and stylesheets.
3. Pretty much any processing work that you might want. Because it’s a pipeline, you can intercept those resources and modify them at runtime.

Laravel’s Asset Pipeline

Laravel doesn’t come with an Asset Pipeline installed by default, but fortunately, the guys at CodeSleeve have created a mature, well rounded package to add an Asset Pipeline; It’s even super simple to set up. You can find it here.

Installation

The first thing we need to do is add the dependency to our composer.json file so that when we update our project, the Asset Pipeline will be included.

"require": {
  "laravel/framework": "4.1.*",
  "codesleeve/asset-pipeline": "dev-master"
}

After adding this, you’ll need to run composer update, because composer install looks at your lockfile and installs those packages. Since the lockfile is generated from a previous version of your composer file, it doesn’t have the asset pipeline in it.

When Composer is finished adding the new libraries, you’ll need to add a Service Provider to your app/config/app.php file, so add 'Codesleeve\AssetPipeline\AssetPipelineServiceProvider',to your providers array.

Configuration

CodeSleeve’s Asset Pipeline caches resources in a Production Environment, so since Laravel lives in a Production-Default environment, it will cache its resources by default. Chances are, this isn’t what you want, so make sure that you’ve told Laravel that you’re working in a development environment.

$env = $app->detectEnvironment(array(
    'local' => array('your-machine-name'),
));

After doing this, you’ll need to make sure that the default folder structure is setup; to do this, simply run php artisan assets:setup. Now, the pipeline is ready for usage.

Usage

You need to tell Laravel to use the stuff that is in the assets folder created in the last step: add these to your layout files in the appropriate places.

<?= stylesheet_link_tag() ?>
<?= javascript_include_tag() ?>

Conclusion

This tutorial only shows how to setup the asset pipeline for Laravel. As such, it only touches the surface of what you can do – check out their Github repository to learn what all you can do with this.