`hoistUseStatements` doesn't work when using `:export`

[Sébastien LeBlanc]

When using :export to expose variable to JS (sass-loader in webpack), hoistUseStatements doesn't work.
If I comment the :export part, I have no error.

//  Color Variables
$color-white: #ffffff;
$color-black: #000000;
$color-wild-sand: #f6f6f6;
$color-gallery: #ecebeb;
$color-mercury: #e8e8e8;
$color-alto: #d1d1d1;
$color-silver: #bababa;
$color-dusty-gray: #949494;
$color-friar-gray: #837f77;
$color-abbey: #505a5f;
$color-gray: #8f8f8f;
$color-fuscous-gray: #4e4c49;
$color-dove-gray: #666666;
$color-tundora: #484848;
$color-emperor: #534c4c;
$color-dune: #2c2724;
$color-mine-shaft: #272323;
$color-cod-gray: #161414;
$color-alizarin-crimson: #e2273c;
$color-cardinal: #bd2536;
$color-red-orange: #ff253d;
$color-persimmon: #ff5757;
$color-brick-red: #d32c3f;
$color-picton-blue: #4297f4;
$color-web-orange: #f0ab00;
$color-salem: #15964d;
$color-jungle-green: #31b56b;
$color-ebb: #eee9e9;
$color-dorado: #655e5b;
// -- Color uses --
$c-primary: $color-alizarin-crimson !default;
$c-primary-hover: $color-red-orange !default;
$c-secondary: $c-primary !default;
$c-error: $color-cardinal !default;
$c-tag-color: $color-picton-blue !default;
$c-label-color: $color-dove-gray !default;
$c-alt-font: $color-mine-shaft !default;
$c-body-background: $color-wild-sand !default;
$c-dark-background: $color-mine-shaft !default;
$c-dark-button: $color-cod-gray !default;
$c-light-title: $color-alto !default;

$c-nuxt-progress: darken($c-primary, 12%) !default;
$c-gradient-sidebar: linear-gradient(218deg, $c-primary 0%, $color-cardinal 77%) !default;
$c-bubble-color: $c-primary !default;
$c-bubble-hover: $c-primary-hover !default;

// Export Variable to JavaScript
$js_primary: $c-primary !default;

$js_growthwheel_colorstop_1: #ff3b3b !default;
$js_growthwheel_colorstop_2: #da071e !default;

$js_progressbar_colorstop_1: #ff5353 !default;
$js_progressbar_colorstop_2: $c-primary !default;
$js_progressbar_colorstop_3: #d32c3f !default;

$js_chartjs_color: $c-primary;
$js_chartjs_colorstop_1: rgba($c-primary, 0) !default;
$js_chartjs_colorstop_2: rgba($c-primary, 0.8) !default;

// Use with this.$colors.primary
:export {
    primary: $js_primary;

    growthwheel_colorstop_1: $js_growthwheel_colorstop_1;
    growthwheel_colorstop_2: $js_growthwheel_colorstop_2;

    progressbar_colorstop_1: $js_progressbar_colorstop_1;
    progressbar_colorstop_2: $js_progressbar_colorstop_2;
    progressbar_colorstop_3: $js_progressbar_colorstop_3;

    chartjs_color: $js_chartjs_color;
    chartjs_colorstop_1: $js_chartjs_colorstop_1;
    chartjs_colorstop_2: $js_chartjs_colorstop_2;
}

[Sébastien LeBlanc]

[Justin Gordon]

@mrleblanc101, I'm totally open to a PR that fixes the issue.

[Justin Gordon]

@Tomburgs any ideas?

[Sébastien LeBlanc]

I've moved my :export to a separate file not loaded my sass-resource-loader in the meantime. I would've preferred to keep the :export inside my color variable file, but that will do in the meantime