1

I'm using the sass library 'bourbon neat'. It provides a mixin called "outer-container".

I have a sass file structured like this:

@import bourbon/bourbon
@import neat/neat

@import componentOne

@import componentTwo

I want to use neat from within both the files componentOne and componentTwo.

Within both files I have use the mixin:

@include outer-container;

If I use the mixin from just within componentOne, I get the result I want. The mixin gets used.

If I use the mixin from within componentTwo, my gulp-sass throws the Error:

Error: no mixin named outer-container

   Backtrace:
      componentTwo.scss
    on line 3 of componentTwo.scss

@include outer-container;

I could cheat by importing the entire library into the second file. But if I read the sass docs right, the mixin should be available to both componentOne.scss and componentTwo.scss, because they are both @imported into a file that already imports the library.

What's going on here? How do I use the library in all my sass files without importing it into each file?

Avnesh Shakya
  • 3,828
  • 2
  • 23
  • 31
bob
  • 753
  • 4
  • 15
  • 27
  • Are you sure both component are in same directory and you included correctly this: `@include outer-container;` in your both component? Not able to see what you are missing. – Avnesh Shakya Jul 28 '17 at 13:49
  • Hi @AvneshShakya. Yes, both components are in the same directory. And the line '@include outer-container' is included within css blocks in both files. And yet 'outer-container' is only available to componentOne. Afaict, I'm doing everything by the docs. I'm probably doing something wrong, but I can't see it. – bob Jul 28 '17 at 13:59
  • I mean, just to be clear: if I cut blocks of code from componentOne.scss (specifically blocks that use code from neat) and paste them into componentTwo.scss, then I get the error. – bob Jul 28 '17 at 14:59

0 Answers0