Hacker News new | past | comments | ask | show | jobs | submit login

We've actually stopped using all pre-processor for everything we do for Segment.io[1] as well, and we're not beginners.

One of the biggest problems with them is that you immediately eliminate a huge portion of the people who are willing to contribute to your code if you select a pre-processor they aren't fond of. It's fine for app internals, but for sharing small[2] open-source[3] components[4] it's not a good idea—whether it's Sass or CoffeeScript or Jade or whatever.

The other problem with CSS pre-processors specifically is that they only work well with the monolithic app mindset. All of your CSS files inside the same `styles` folder, and all of them required by the "top of the monolith" `main.sass` file. Instead, using something like component[5] you get true dependency trees, so you don't have to go monolithic anymore. And trying to get Sass to work across a component-ized codebase is a real pain. Instead we use Myth[6] to "post-process" the built CSS.

Pre-processors are a leaky abstraction that comes back to bite you at random points the way all leaky abstractions do, and the ways are usually hard to foresee and thus hard to argue against when the benefits seems so clear.

[1]: https://segment.io

[2]: https://github.com/segmentio/toggle

[3]: https://github.com/segmentio/sheet

[4]: https://github.com/component/tip

[5]: https://github.com/component/component

[6]: http://myth.io




Preprocessors aren't incompatible with components. I usually structure my frontend code like

    components/
        widget-one/
            template.html
            script.js
            style.css
        widget-two/
            template.dust
            script.coffee
            style.styl
And then the style file for a component is completely scoped to that component's main class:

    .widget-two {
        .widget-two-control { color: blue; }
    }
The build script can handle each component separately and stitch the results together. Just because SASS/compass encourages a monolithic style doesn't mean it's necessary.


Yeah, the problem comes in when you want to share pre-processor variables between your components.




Join us for AI Startup School this June 16-17 in San Francisco!

Guidelines | FAQ | Lists | API | Security | Legal | Apply to YC | Contact

Search: