want to pass session storage variable in to scss file

Question

i want to get session storage in to my scss file in here have my scss file and component.ts file

       <<---- component.ts file ---->>


this.BarWidth = sessionStorage.getItem('BarWidth');
    this.BarHeight = sessionStorage.getItem('BarHeight'); 

<<--- Scss file --->>
$BarWidth = sessionStorage.getItem("BarWidth");
$BarHeight =  sessionStorage.getItem("BarHeight");

.barcode_6_style {
    max-width: $BarWidth;
    min-width: $BarWidth;
    max-height: $BarHeight;
    min-height: $BarHeight;
    border-style: solid;
    border-left-width: 1px;
    border-top-width: 1px;
    border-right-width: 1px;
    border-bottom-width: 1px;
}`

Answer 1

I wanted the same feature a while back but realized this is already supported by webpack. My solution looks like this:

var sass = encodeURIComponent(jsonToSassVars(sassGlobals));
var webpackConfig = {
    module: {
        loaders:[
            {test: /.scss$/, loader: "style!css!sass!prepend?data=" + sass}
        ]
    },
}