title: How to import and use Bulma framework with SCSS but not export all it's contents to CSS
body: <p>I have been using Bulma CSS framework a lot on my recent web projects, it's amazing and makes my work easier and straightforward.</p>
  
  <p>However I don't use most of it's features, just a few. I know I can import only the files I need and for example: If I only need the columns system I would create a SCSS file like this:</p>
  
  <pre><code>@import "bulma/sass/utilities/_all.sass";
  @import "bulma/sass/base/_all.sass";
  @import "bulma/sass/grid/columns.sass";
  </code></pre>
  
  <p>This will generate a huge CSS file and I won't need the most of it! I will only make use of it with the @extend keyword like this:</p>
  
  <pre><code>.my-column {
    @extend .column;
    ...
  }
  </code></pre>
  
  <p>But the generated CSS file will be poluted with lines like these:</p>
  
  <pre><code>/* line 3, ../sass/bulma/sass/grid/columns.sass */
  .column, .my-column {
    display: block;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 1;
    padding: 0.75rem;
  }
  /* line 9, ../sass/bulma/sass/grid/columns.sass */
  .columns.is-mobile &gt; .column.is-narrow, .columns.is-mobile &gt; .is-narrow.my-column {
    flex: none;
  }
  /* line 11, ../sass/bulma/sass/grid/columns.sass */
  .columns.is-mobile &gt; .column.is-full, .columns.is-mobile &gt; .is-full.my-column {
    flex: none;
    width: 100%;
  }
  /* line 14, ../sass/bulma/sass/grid/columns.sass */
  .columns.is-mobile &gt; .column.is-three-quarters, .columns.is-mobile &gt; .is-    three-quarters.my-column {
    flex: none;
    width: 75%;
  }
  </code></pre>
  
  <p>The first block is what I want only. I will not use most of the generated classes in my HTML, only the my-column class.</p>
  
  <p>What I'm looking for is for the pre-processor only include in the class that I declare (my-column) what is needed in this way:</p>
  
  <pre><code>.my-column {
    display: block;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 1;
    padding: 0.75rem;
  }
  </code></pre>
  
  <p>I don't know if it's possible, maybe is not necessary because the Bulma framework is very lightweight. I just don't like to have so much stuff in the CSS file that's not necessary.</p>
  
  <p>Maybe I just got this whole SCSS pre-processor thing wrong. But if I did not made myself clear in anyway please let me know in the comments.</p>
  
  <p>Thanks for your time!</p>