Stylus with Sage 9

sage
1

The last time I used Sage was with version 8 and I used the Stylus fork:

https://github.com/hew/sage-lost-stylus

Unfortunately this fork hasn’t been updated for Sage 9 and it doesn’t look like it will be. I’m planning to use Sage 9 and I’d prefer Stylus over SASS if possible so I can more easily reuse my previous work.

I did some searches but haven’t found much about using Stylus with Sage 9. Does anyone have any suggestions or pointers on where to start? I guess I should modify webpack.config.js but I was also thinking of making a child theme so I can update Sage later if I need.

Any thoughts welcome! :slight_smile:

1 Like
2

https://github.com/shama/stylus-loader/blob/master/README.md looks like a good place to start. I’d go through that, and then look through Sage’s webpack.config.js and switch/imitate all the SCSS sections to to Stylus instead.

I maintain my own fork of Sage that has a few tweaks instead I’d dealing with a child theme, and so far that’s been a fine experience. As long as you merge in upstream changes regularly, it’s not onerous. One of my customizations was to strip out SCSS entirely and just use PostCSS, and it was pretty simple, so I don’t think making your own Stylus fork would be very hard. :slight_smile:

2 Likes
3

Thanks very much @alwaysblank! That looks like exactly what I need… I will give it a try :slight_smile:

I like your idea of keeping a fork instead of a child theme. For my purposes, I think that will be a much better approach. Appreciate your wisdom!

1 Like
4

https://github.com/kaisermann/selene/ is a Sage 9 fork using Stylus.

Edit: Selene might not be a helpful reference, since it uses Gulp instead of Webpack.

5

Thanks @mikespainhower! It looks like an interesting, well thought-out project… Since I’ve already started with Sage 9, I will probably try to stick with a Webpack solution so it doesn’t diverge too much from the standard version.

However, I will study the Selene code more because there might be some features and ideas I can borrow :slight_smile: