jekyllrb.com / CC-BY 4.0

jekyll-assetsは、サイトのリソースをまとめてひとつにしたり、圧縮したりしてくれる便利なプラグインです。

例えば、cssでいいますと

/_assets/css/_style.scss 
/_assets/css/_toc.scss 
/_assets/css/_sub.scss 

みたいに目的別にファイルを作成しておいて

/_assets/css/main.scss

メインのCSSファイル(というかSCSSだけど)で

@import "style"
@import "toc"
@import "sub"

各ファイルをimportしておけば、すると jekyll-assets が自動的に

/assets/css/main.css

のような、一つのファイルにしてくれるので、Webサイトとしては、リクエストが一回で済む。まさにコンパイルだな。

が、しかし
/assets/css/ を確認しても main.css が生成されていない。なぜ?

と思ったら、実際に生成がおこなわれるためには、

HTMLファイルのほうで、次のような

 {% css main %} 

jekyll-assets が用意しているタグを呼んでやる必要がある。 これは次ように置換されます。

<link rel="stylesheet" type="text/css" href="/assets/css/main.css" />

生成は、タグからリクエストがあった場合のみ、処理が行われるわけです。勝手にソースディレクトリ全体を検索して、対象のリソースを探して生成してくれるわけではないのです。

これは jekyll-assets の他のタグ(jsやimageなど)でも同じです。