Jekyll Assets

What is an Asset Pipeline

From http://guides.rubyonrails.org/asset_pipeline.html:

The asset pipeline provides a framework to concatenate and minify or compress JavaScript and CSS assets. It also adds the ability to write these assets in other languages and pre-processors such as CoffeeScript, Sass and ERB.

Introduction to Jekyll-Assets

Jekyll-Assets is an asset pipeline for Jekyll. Documents and tutorials:

• http://jekyllrb.com/docs/plugins/
• http://jekyll.github.io/jekyll-assets/
• http://ixti.net/software/2012/12/30/unleash-mr-hyde-introduction-of-jekyll-assets.html
• https://github.com/jekyll/jekyll-assets/blob/master/lib/jekyll/assets/config.rb

Deployment of Jekyll-Assets

• Install gems:

  gem install jekyll-assets sass uglify
  

• Configure assets in _config.yml:

  gems: [jekyll-assets]
  
  assets:
      prefix: "/assets"
      sources:
          -   _assets/css
          -   _assets/img
          -   _assets/js
      compress:
          css: sass
          js: uglifier
      features:
          automatic_img_alt: true
          automatic_img_size: false
  

• Add assets:

  cd <jekyll_dir>
  mkdir -p _assets/{css,js,img}
  touch _assets/css/main.scss
  touch _assets/js/main.js
  touch _assets/img/main.jpg
  

• Use assets in HTML pages:

  {% css main %}
  {% js main %}
  {% img main.jpg %}
  <img src="{% asset_path main.jpg %}">
  

• Finally, build:

  jekyll build