Use with compass?

[jleppert]

Is it possible (now or in the future) to use libsass with Compass? Compass does add a bunch of custom sass functions, and I'm wondering if it would be possible to call back into Ruby (using Ruby C API) for those functions (in lieu of writing all those functions in C)?

[craigbarnes]

See #78.

[HamptonMakes]

Yeah, this is definitely in the plans. We mostly use Bourbon and our own extensions ourselves, but a little bit of effort and we can get native function hooks in place.

[kaelig]

I use bourbon as well (and thought I would be able to use libsass to compile the project), but unfortunately it chokes on this piece of code:

@mixin box-shadow ($shadows...) {
    @include prefixer(box-shadow, $shadows, webkit spec);
}

ERROR -- views/legacy/utils/../../vendor/bourbon/css3/_box-shadow.scss:1: parameter list for box-shadow requires a ')'

Cf #73

[sroussey]

Something like a libcompass to go with libsass would be awesome.

[akhleung]

It'll be in the works as soon as I finish the current overhaul (should be done within the week)! See @chriseppstein's comment in #98.

[sroussey]

Awesome! I am working on theme generation for various frameworks that use Sass+Compass, and would love to do it client side (if I can get them as NaCL for Chrome for example), rather than have my poor server churn on stuff for 100,000 users with the browser extension. :/

[kud]

Nothing interesting but I'd really love to see compass support too. ;) 👍

(or finding a way to generate sprite without compass...?)

[kaelig]

For sprite generation you can use grunticon: https://github.com/filamentgroup/grunticon

[kud]

Yeah I know, I already have a good process for svg to sprite but on desktop version, we still have a sprite coming from some png... :/

Either I still continue to use compass either I have to do a refacto on all our icons. The second one should/could be the solution but it ain't the right time.

[lessallan]

@hcatlin, my love, let's make this happen. I'm wanting to use http://usetakana.com + compass on our projects.

[Aurontwist]

+1

[mikew]

@kaelig Maybe I'm missing something in grunticon, but right in the first paragraph of their README it states

From a CSS perspective, it's easy to use, as it generates a class referencing each icon, and doesn't use CSS sprites.

Also their lack of generated dimensions makes it a no-go for me. Something like sprite-brunch might help some people though.

[miki-soichiro]

+1

[clifton]

👍

[kaelig]

@mikew, I confused grunticon with being a sprite generator because at the Guardian we use a modified version of it that generates a sprite image fallback: https://github.com/guardian/frontend/tree/master/tools/sprites

[deanmao]

Any progress on this one? We still use compass for some stuff, but would be nice to remove the ruby dependency. I wouldn't even mind writing C code if it lets us extend the features of libsass to do stuff, the same way that ruby's sass lets you write extensions.

I don't even use most of the features of compass, I just want it for the sprite handling. Of course there are other alternatives to sprite handling in node, but they don't use sass (stylus & less have some options I think)

I put the $50 bounty on it, but I guess I made the bounty anonymous, oh well.

[javoire]

+1

[RobinQu]

Is it possible to rewrite compass using node with node-scss, which is a binding of libscss?

[emagnier]

Recently with the addition of the @extend and Sourcemap features, I have the feeling that Libsass is becoming increasingly popular (there is also a nice community around node-sass, and it also start to be integrated in some IDEs!). Therefore a Compass port will be also more and more requested (notice the Bounty on this thread) 👍

@hcatlin, @akhleung and/or @chriseppstein, do you have any plan for the coming "LibCompass"? Is the Compass port should be prioritized/separated by modules? For example, I personnaly use a lot Sprites, Image Dimensions and Inline Data modules (almost never the others).

Perhaps by creating an official repo with some basis code, the community could then help.

I don't know C/C++ well enough, but where I can I would love to contribute!

[RobinQu]

I came across some code of compass project, and found that it's pretty hard to implement the whole compass using node-scss:

1. Custom functions like inline-image have to be written in C/C++
2. Custom functions have to be registered with SCSS context. That means, if you are going to implement function in nodejs, you have to figure out how to teach C/C++ code to talk with javascript (Type conversion, scope) . I know this is possible with v8 and node binding API, but it's difficult. And I don't know why we should make such efforts to do so.

Despite the clues given above, there might be other options:

1. make void register_function(Context&, Signature sig, Native_Function f, Env* env); to support V8 JS function in node-scss.
2. Write a scss compiler in purely Javascript. (EST. one weak at least). As a result, the whole compass stack could be rewritten in Javascript, quick and clean.

[F21]

👍 This would be awesome for us as we are finding the ruby scss with compass to be quite slow for some of our larger projects.

[zachlatta]

👍 Would also be appreciated. I will <3 everyone here if this happens.

[andrejmlinarevic]

+1 For the idea. Would be a great performance enhancement and workflow speedup.

[gisu]

I think it makes more sense to bring Libsass on the same level off ruby-sass (Maps, List Improvements, root selectors etc), and than find a way to implement Compass Features in Libsass. The only thing that i miss from Compass is the Image Handling - but i have a grunt task for. Sprite Generation is nice but for me is not super important - we have several Grunt Tasks to build Sprites (with SVG support - compass didn't have SVG Sprites).

The most important is to hold the Compiletime - is the best thing off Libsass )

[akhleung]

Yeah, we're not planning to add Compass features directly to LibSass; rather, we intend to catch up with Ruby Sass, and implement a way for users to create dynamically loadable native extensions. This should allow Compass itself to be ported atop LibSass.

[jsg2021]

+1

[lamosty]

this would be really helpful. Can't work without compass

[frewsxcv]

@chriseppstein Do you need any help with making Compass compatible with libsass?

[chriseppstein]

@frewsxcv I need libsass to support Sass 3.3 features. That's the biggest blocker.

[ronilaukkarinen]

I also would like to libsass (to go with gulp) to support Sass 3.3 and preferably Compass. Would make my life so much easier. Because of so many caveats using with libsass only I'm now using gulp-ruby-sass.

[twhitbeck]

@chriseppstein am I right in thinking the latest version of libsass (3.0) which targets Sass 3.4 should be sufficient for making Compass compatible?

[stffndtz]

+1

[ChrissiQ]

How's this doing? I'd be very excited to use libsass with compass. Compile times with ruby are killing me on Windows.

[tommmyy]

+1

[sheadawson]

+1

[callaars]

+1

[JingleChannel]

+1

[mikeya]

+1

[amcc]

using grunt-sass with compass-mixins as a Bower package worked well for me. See this how to, then look at comment #27 on this page:
http://benfrain.com/lightning-fast-sass-compiling-with-libsass-node-sass-and-grunt-sass/
Seems to work fine as far as i can tell

[chriseppstein]

FYI: Compass/compass#1916

[drewwells]

Check out Wellington, it is a drop in replacement for Compass but is built with libsass. There's benchmarks comparing it to Compass and https://github.com/wellington/grunt-wellington for integrating Wellington with Grunt.

On OS X, install it with brew

brew install wellington
wt -h

[Zauberfisch]

wow, that looks really interesting as a temporarily solution until compass has been ported over.
thanks for sharing @drewwells

[jeromecovington]

+1 for this issue in general. But in the specific, I am looking for drop in replacements for these:

@import "compass/css3";
@import "compass/css3/user-interface";
@import "compass/css3/transform";
@import "compass/utilities/general/clearfix";

Does anybody know about compass support in general, to date? Is there support for the above?

[drewwells]

I created Wellington as a libsass powered replacement for the spriting
aspects of compass. You can install it with brew, more info here:
https://github.com/wellington/wellington

For the compass mixins, there are sass libraries that emulate those ie.
https://github.com/Igosuki/compass-mixins
On Tue, May 5, 2015 at 2:35 PM Jerome Covington notifications@github.com
wrote:

+1 for this issue in general. But in the specific, I am looking for drop
in replacements for these:

@import "breakpoint";
@import "compass/css3";
@import "compass/css3/user-interface";
@import "compass/css3/transform";
@import "compass/utilities/general/clearfix";

Does anybody know about compass support in general, to date? Is there
support for the above?

—
Reply to this email directly or view it on GitHub
#82 (comment).

[Snugug]

The official direction of the Libcompass project is a pivot from C to a Node Sass compatible core called Eyeglass

Most of the most popular Compass extensions will likely be ported to Eyeglass. Breakpoint will be (and is available now as a Bower install). With the Node pipeline, CSS3 mixins are generally handled through Autoprefixer. There are other Clearfix mixins, like the one provided by Toolkit (likewise Bower available, will be Eyeglass available).

[xzyfer]

Compass will never be compatible with Libsass. Compass pokes around in the Ruby Sass internals for some things which simply isn't possible with Libsass.

If you're just using the css3 and/or utility mixins then you can bower install compass and use the mixins directly. Alternatively I would recommend:

• Bourbon for convenience mixins and helpers.
• Autoprefixer if you just need vendor prefixing.

As @Snugug points out, over time more and more Compass functionality will be made available in node-sass via Eyeglass which is run by the author of Compass. More information in Compass/compass#1916 (comment).