Jekyll Assets 3 has been released, here's what's new.

Today, Jekyll Assets 3.0.0 has been released 🎂. It involved a major rewrite, for a sponsored feature (SourceMaps,) and a major speed boost, with a major boost to people's ability to make plugins that hook into Jekyll-Assets, in the future. Here is what's new:

We've removed {% css %}, {% link %}, {% img %}, and any other tag, and left only one tag to rule them all {% asset %}, since Sprockets 4 now requires you to add an extension for most asset searching, it's no longer necessary for us to carry multiple tags to set a series of basic content types, we now have a single tag that deals with everything, including determining content type.

Like the movie, but less funny, and less dumb (in all fairness it wasn't meant to be a serious movie). Now our system caches much better, we use the manifest more, we more efficiently process, and just, yeah see it for yourself.

Configuration file: /srv/jekyll/_config.yml
            Source: ./source
       Destination: ./site
 Incremental build: disabled. Enable with --incremental
      Generating... done in 6.133 seconds.
 Auto-regeneration: enabled for './source'
 LiveReload Server: http://0.0.0.0:35729
    Server address: http://0.0.0.0:4000
  Server running... press ctrl-c to stop.
      Regenerating: 1 file(s) changed at 2017-11-21 11:03:32
        ...done in 2.424920382 seconds.

We now support being a direct drop-in replacement for Jekyll's own basic asset processing, but unlike Jekyll, we put the power in your hands, as Jekyll Assets is truly hackable, and extensible, like Jekyll Core, but compared to Jekyll's very basic asset system, we give you flexibility.

🎉 We now strip ---\n---, which Jekyll uses to determine assets... 🎉

assets/css
assets/fonts
assets/images
assets/videos
assets/javascript
assets/video
assets/image
assets/img
assets/js
_assets/css
_assets/fonts
_assets/images
_assets/videos
_assets/javascript
_assets/video
_assets/image
_assets/img
_assets/js
css
fonts
images
videos
javascript
video
image
img
js

By default we still default to Sprockets 3.x but now we also support Sprockets 4.x if you are looking for some speed boosts (trust me, it's worth it.) It also enables some of our other features, like SourceMaps, and other features.

gem "sprockets", "4.0.beta"

This has been a long standing request from the community. To support responsive images. Prior to this rewrite, it would have been a huge undertaking because I never designed 2.x to do the kind of stuff I designed 3.x to do. Now you can do basic responsive images (and kick on your own advanced responsiveness by going manual on media and sizes). You can learn more about how it works here: https://github.com/envygeeks/jekyll-assets#responsive-images

{% asset img.png @pic
    srcset:max-width="800 2x"
    srcset:max-width="600 1.5x"
    srcset:max-width="400 1x"
      %}

<picture>
  <source srcset="1.png 2x"   media="(max-width:800px)">
  <source srcset="2.png 1.5x" media="(max-width:600px)">
  <source srcset="3.png 1x"   media="(max-width:400px)">
  <img src="img.png">
</picture>

{% asset img.png
    srcset:width="400 1x"
    srcset:width="600 1.5x"
    srcset:width="800 2x"
      %}

{% asset img.png
    srcset:width=400
    srcset:width=600
    srcset:width=800
      %}

<img srcset="1.png   2x, 2.png 1.5x, 3.png   1x">
<img srcset="1.png 400w, 2.png 600w, 3.pnx 800w">

Sprockets 4 brought better audio/* and video/* support. We now support consuming any supported content type, and pushing out a <video> or <audio>, we've even let you customize the attributes that get passed to them.

in 2.x we had no ability to allow you to quickly copy assets you didn't need to go through the pipline, but wanted inside of your assets folder, this is particularly useful for cases of Emoji systems, where they provide a super huge set of images, but precompiling all those assets even at their most basic through the pipeline is expensive. You can cp these asses quickly now with Jekyll Assets by configuring your project like the following:

assets:
  raw_precompile:
  - twemoji/2/svg/1f3c3-1f3fb-200d-2640-fe0f.svg
  - src: twemoji/2/svg/*.svg
    dst: twemoji

Tired of not being able to see your assets when working in Atom Editor or any other editor that has support for markdown previews? We now support the native image tag with a custom attribute, <img asset>. So you can see our assets before they are processed, and then as your site processed, we transform that, it even works with proxies!

<img src="asset.png" asset>
<img src="asset.png" asset="magick:resize=400">

In 2.x we used a home grown tag parser, and we still do, except now it's extracted into it's own so bugs can be fixed. And aside from that, it uses Jekyll style standard syntax, with much more powerful handling of arguments. We now support array's, hashes, and it looks more like Jekyll.

{% asset asset.ext key:subkey=val array=1 array=2 %}

You can use proxies within asset_path and any other helper provided by Sprockets themselves. This works the same as the tag arguments, and works the same as asset_path except with extra spaces, this even works with global (read: site) variables, avoiding the Liquid broke my JavaScript problem with .css.liquid or .liquid.css, see it in action for yourself

body {
  background-image: asset_url("'{{ site.bg }}' magick:resize=1200")
}

We now support SourceMaps. By default they are only enabled when you have Sprockets 4.x, and they are external, so you use them in production too, if you really want, but we disable them in production.

assets:
  source_maps: true

You can now customize the defaults. You can disable any default we create by shipping !attrName, which will tell us you don't want it, or you can add your own defaults if you want, for example, lets say you want your movies to autoplay, but you don't want to add @autoplay to every single {% asset %}. You can now create a simple plugin, make sure it's required inside of your Jekyll, and do the following:

# Frozen-string-literal: true
# Copyright: 2012 - 2017 - MIT License
# Encoding: utf-8

require "jekyll/assets"

module EnvyGeeks
  class Video < Jekyll::Assets::Default
    content_types %r!video/[a-zA-Z]+!

    def set_autoplay
      return if args.key?(:autoplay)
      args.update({
        autoplay: true
      })
    end
  end
end

Please remember, I'm trying to make a living on OpenSource, if you like my software, donate if you can! I never ask people to file pull-requests, and some projects take considerable time, I have no external funding. I also take paid jobs to fix bugs in other peoples OpenSource projects, or to take on features, no matter how large or small. If you would like to sponsor, please email. Or if you are looking for a full-time, contract or not, full-stack developer, I'm also available for hire.