Convert Stylus to SASS
Here's how I converted a whole batch of Stylus files to SASS without using a converter (none exist, that I'm aware of), converting each Stylus file manually, or programming my own Stylus->SASS converter, which would have entailed building a parser, and then generate SCSS from the AST.
sandr.py here: https://github.com/jfgiraud/sandr
Then, in the directory of your Stylus files, run (if you have multiple directory levels, you can do similar task using
for file in *.styl; do echo "/*! FILENAME: $file */" >tempfile; cat $file >>tempfile; mv tempfile $file; done
This is so you'll be able to properly divide up the CSS/SCSS once we finish, since we have to compile it into a single file (no way around this that I know due to scoping issues). The exclamation mark appears necessary for the Stylus compiler to retain the comment.
Then, using the Stylus binary where you have installed any Stylus modules, compile your Stylus into a single CSS file:
./node_modules/.bin/stylus -u nib -u jeet -p YOURMAINSTYLUSFILE.styl > all.css
Then, create a map of your Stylus variable values to their corresponding variables. If you've got a deliminter of more than one space between the variable and value, Awk is nice for this (this is set to 2 spaces):
$ to these variables, which I used Vim's column insert to do.
sandr.py and the map you've created to replace all the occurances of these variables in the
all.css file with the variables you've created.
Rename the CSS file to .scss, and see if it validates. If it does, you can now go through and divide the files back up into individual SCSS files according to the inserted comments with the filenames.
OK, so it's involved a lot of manual work, and it's an ugly hack, but it took at least me less time to do this for ~20 Stylus files than it would have to build a converter manually, or to manually port each of these files into SASS.
Obviously, if you're doing this more than once or possibly twice, you probably want to go ahead and build a proper parser/generator for this.
Hi! Thanks for this guide!
I just converted 15 stylesheets using another technique and wanted to share it.
I used www.sasstoscss.com to convert stylus to scss.
Since stylus is pretty similar to sass (indent based), I just had to add colons where missing and convert the function mixins.