Challenges installing fixed-sticky polyfill using Bower

sage
1

Hi folks,

I’ve managed to partially add the filamentgroup/fixed-sticky polyfill to my project by executing:

bower install --save fixed-sticky#0.1.7

from my Sage theme directory. That works fine, but after running gulp to build the project, I don’t see this new Bower component’s CSS file included in the section of my main.scss file – the section demarcated by:

// Automatically injected Bower dependencies via wiredep (never manually edit this block)
// bower:scss
…
// endbower

I tried adding a main override in my bower.json to see if that would help, but it didn’t (I guess that’s pointless because the component’s .css file is already included as a dependency of main in its own bower.json). No clue why it’s not automatically adding a reference to the CSS file to this section.

So I just manually @imported the fixedsticky.css file in main.scss, just to see if I could get the thing working.

That worked fine, I got the .fixedsticky class into my compiled CSS.

But when I try to do @extend .fixedsticky anywhere in my .scss files after that line (which I need to do for my project), SASS complains that it’s not a valid selector. This is bizarre, because if I copy and paste the .fixedsticky { … } declaration into my main.scss file, it compiles fine.

Anyway I can get by with this rather messy and redundant approach, I’m just a bit disappointed that it doesn’t just work cleanly and automatically, the way everything else seems to in Sage (in my experience, so far :slight_smile: ).

2

Try $ bower install filament-sticky --save instead

3

That’s actually what I did in the end, didn’t make a difference. Seems the two components are identical, or at least have the same bower.json from what I could tell.

In the end I couldn’t use this polyfill for my project, as it was a bit buggy. Went with Stickyfill, which works better for me, and has no associated CSS file that will be mysteriously ignored by wiredep. :wink:

Thanks anyway.