New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Use with compass? #82

Closed
jleppert opened this Issue Dec 26, 2012 · 70 comments

Comments

Projects
None yet
@jleppert
Copy link

jleppert commented Dec 26, 2012

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

This comment has been minimized.

Copy link
Contributor

craigbarnes commented Dec 26, 2012

See #78.

@hcatlin

This comment has been minimized.

Copy link
Member

hcatlin commented Feb 3, 2013

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

This comment has been minimized.

Copy link
Contributor

kaelig commented Apr 11, 2013

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

This comment has been minimized.

Copy link

sroussey commented Jun 9, 2013

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

@akhleung

This comment has been minimized.

Copy link

akhleung commented Jun 9, 2013

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

This comment has been minimized.

Copy link

sroussey commented Jun 9, 2013

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

This comment has been minimized.

Copy link

kud commented Jul 5, 2013

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

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

@kaelig

This comment has been minimized.

Copy link
Contributor

kaelig commented Jul 5, 2013

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

@kud

This comment has been minimized.

Copy link

kud commented Jul 5, 2013

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

This comment has been minimized.

Copy link

lessallan commented Oct 17, 2013

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

@Aurontwist

This comment has been minimized.

Copy link

Aurontwist commented Nov 23, 2013

+1

@mikew

This comment has been minimized.

Copy link

mikew commented Nov 23, 2013

@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

This comment has been minimized.

Copy link

miki-soichiro commented Nov 24, 2013

+1

1 similar comment
@clifton

This comment has been minimized.

Copy link

clifton commented Nov 26, 2013

👍

@kaelig

This comment has been minimized.

Copy link
Contributor

kaelig commented Nov 26, 2013

@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

This comment has been minimized.

Copy link

deanmao commented Jan 8, 2014

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

This comment has been minimized.

Copy link

javoire commented Jan 9, 2014

+1

@RobinQu

This comment has been minimized.

Copy link

RobinQu commented Jan 10, 2014

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

@emagnier

This comment has been minimized.

Copy link

emagnier commented Jan 16, 2014

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

This comment has been minimized.

Copy link

RobinQu commented Jan 16, 2014

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 comment has been minimized.

Copy link

F21 commented Jan 26, 2014

👍 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

This comment has been minimized.

Copy link

zachlatta commented Jan 31, 2014

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

@andrejmlinarevic

This comment has been minimized.

Copy link

andrejmlinarevic commented Jan 31, 2014

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

@gisu

This comment has been minimized.

Copy link

gisu commented Jan 31, 2014

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

This comment has been minimized.

Copy link

akhleung commented Jan 31, 2014

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

This comment has been minimized.

Copy link

jsg2021 commented Aug 7, 2014

+1

@lamosty

This comment has been minimized.

Copy link

lamosty commented Aug 8, 2014

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

@frewsxcv

This comment has been minimized.

Copy link

frewsxcv commented Aug 12, 2014

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

@chriseppstein

This comment has been minimized.

Copy link
Member

chriseppstein commented Aug 13, 2014

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

@ronilaukkarinen

This comment has been minimized.

Copy link

ronilaukkarinen commented Aug 14, 2014

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.

@miniflycn miniflycn referenced this issue Aug 25, 2014

Closed

技术规划 #3

@zamith zamith referenced this issue Oct 6, 2014

Open

Compass #6

@twhitbeck

This comment has been minimized.

Copy link

twhitbeck commented Oct 21, 2014

@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

This comment has been minimized.

Copy link

stffndtz commented Oct 29, 2014

+1

@ChrissiQ

This comment has been minimized.

Copy link

ChrissiQ commented Nov 6, 2014

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

@tommmyy

This comment has been minimized.

Copy link

tommmyy commented Nov 13, 2014

+1

4 similar comments
@sheadawson

This comment has been minimized.

Copy link

sheadawson commented Nov 21, 2014

+1

@bcallaars

This comment has been minimized.

Copy link

bcallaars commented Dec 30, 2014

+1

@JingleChannel

This comment has been minimized.

Copy link

JingleChannel commented Jan 8, 2015

+1

@mikeya

This comment has been minimized.

Copy link

mikeya commented Jan 13, 2015

+1

@amcc

This comment has been minimized.

Copy link

amcc commented Jan 13, 2015

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

This comment has been minimized.

Copy link
Member

chriseppstein commented Jan 14, 2015

@drewwells

This comment has been minimized.

Copy link
Contributor

drewwells commented Mar 6, 2015

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

This comment has been minimized.

Copy link

Zauberfisch commented Mar 6, 2015

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

@jeromecovington

This comment has been minimized.

Copy link

jeromecovington commented May 5, 2015

+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

This comment has been minimized.

Copy link
Contributor

drewwells commented May 5, 2015

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

This comment has been minimized.

Copy link

Snugug commented May 5, 2015

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

This comment has been minimized.

Copy link
Contributor

xzyfer commented May 6, 2015

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:

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).

@sass sass locked and limited conversation to collaborators May 6, 2015

designorant referenced this issue in samusgray/meteor-susy Oct 28, 2015

designorant referenced this issue in francocatena/meteor-compass Oct 28, 2015

@hcatlin hcatlin changed the title Use with compass? [$250] Use with compass? Aug 19, 2016

@hcatlin hcatlin removed the bounty label Aug 19, 2016

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