Menu icon Foundation
"@include exports" what is it for?

could someone explain what is "@include exports" for? for example take a look at the end of the _breadcrumbs.scss file ... why it is not whithout "@include exports("breadcrumbs")"?
Thanks!

@include exports("breadcrumbs") {
  @if $include-html-nav-classes {
    .breadcrumbs {
      @include crumb-container;
      @include radius($crumb-radius);

      &>* {
        @include crumbs;
      }
    }
  }
}
            

         

Sass

could someone explain what is "@include exports" for? for example take a look at the end of the _breadcrumbs.scss file ... why it is not whithout "@include exports("breadcrumbs")"?
Thanks!

@include exports("breadcrumbs") {
  @if $include-html-nav-classes {
    .breadcrumbs {
      @include crumb-container;
      @include radius($crumb-radius);

      &>* {
        @include crumbs;
      }
    }
  }
}
            

         

Albert Treat gave the most helpful answer for this post
Albert Treat over 5 years ago

This prevents duplication of styles if the given file is called via @import elsewhere. The is particularly neat because it allows SASS files to declare their own dependencies.

Here's a little more information, and some examples:
https://github.com/wilsonpage/sass-import-once

Albert Treat over 5 years ago

This prevents duplication of styles if the given file is called via @import elsewhere. The is particularly neat because it allows SASS files to declare their own dependencies.

Here's a little more information, and some examples:
https://github.com/wilsonpage/sass-import-once

James Craine almost 5 years ago

I'm having a strange and very obscure problem with a Gruntfile I'm using. I've traced it down to my grunt file somehow ignoring the @include exports command. The Sass compile is including the global styles with each Foundation component (duplicating).

I would be so grateful if someone could take a look for me:

http://stackoverflow.com/questions/26188949/foundation-global-styles-repeating-unexpectedly-in-grunt-file

Rafi Benkual almost 5 years ago

James, are you using Libsass?

Christian Matthias almost 5 years ago

this doesn't really explain anything?

Marko A over 2 years ago

I agree explanations are unclear.

What is this exports business exactly?

 

Foundation 5 has this piece of code:

 

@include exports("form") {
  @if $include-html-form-classes {
    /* Standard Forms */
    form { margin: 0 0 $form-spacing; }
...
  }
}   

 

I imagined that I could do this in Foundation 5:

#pswp__settings__dropdown {
  form {
    @include form;
  }
}

But I get `Error: no mixin named form`.