Today I Learned

How to Share Variables Between Javascript and Scss/Sass

When you need to share variables between javascript and scss/ sass you can export variables in your style file:

$calendar-min-width: 80px;
$animation-length: 250ms;
$animation-length-ms: $animation-length + 10ms;

:export {
  calendarMinWidth: $calendar-min-width;
  animationMillis: $animation-length-ms;
}

and after that you’re able to get this in javascript:

const variables = {
  calendarMinHeight: parseInt(styles.calendarMinHeight),
  animationMillis: parseInt(styles.animationMillis),
};