Create a gist now

Instantly share code, notes, and snippets.

A Jekyll plugin to convert .styl to .css.
stylus:
compress: true
path: ./path/to/styl
---
---
// See individual.styl below. Notice it has no YAML front matter.
@import 'individual'
html
margin 0
padding 0
# A Jekyll plugin to convert .styl to .css
# This plugin requires the stylus gem, do:
# $ [sudo] gem install stylus
# See _config.yml above for configuration options.
# Caveats:
# 1. Files intended for conversion must have empty YAML front matter a the top.
# See all.styl above.
# 2. You can not @import .styl files intended to be converted.
# See all.styl and individual.styl above.
module Jekyll
class StylusConverter < Converter
safe true
def setup
return if @setup
require 'stylus'
Stylus.compress = @config['stylus']['compress'] if
@config['stylus']['compress']
Stylus.paths << @config['stylus']['path'] if @config['stylus']['path']
@setup = true
rescue LoadError
STDERR.puts 'You are missing a library required for Stylus. Please run:'
STDERR.puts ' $ [sudo] gem install stylus'
raise FatalException.new('Missing dependency: stylus')
end
def matches(ext)
ext =~ /styl/i
end
def output_ext(ext)
'.css'
end
def convert(content)
begin
setup
Stylus.compile content
rescue => e
puts "Stylus Exception: #{e.message}"
end
end
end
end
@Fresheyeball

Where does this output to?

@corysimmons

Thanks for this. Works perfect.

@Fresheyeball It outputs to the /_site/css folder.

@dereksnow

Is there a way to support the --include-css cli option?

@JayByfordRewAtTorFx

I am guessing I put the .rb file in the _plugins folder
I have performed gem install stylus
I guess I have to add gems: - stylus to the _config.yml
I have set the stylus: path: ./_stylus/all.styl
The all.styl I have given front matter empty tags and added an import to my .styl in this case onsenui component
do I have to disable sass conversion somehow because this would overwrite any css created by stylus?

anyway can't seem to get it to work?
probably need better instructions here.
any help appreciated

@damienromito

Does not works for me too... Maybe cause I'm using guard to livereload my code?
By the way, any .css files is generated :(

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment