Adding addition spacers to bootstrap 5

Question

I'd like to add additional spacers to bootstrap 5. I'm including it in sass and overwriting variables.

I want to avoid repeating bootstraps spacer definitions which are :

$spacers: (
  0: 0,
  1: $spacer * .25,
  2: $spacer * .5,
  3: $spacer,
  4: $spacer * 1.5,
  5: $spacer * 3,
);

According to documentation I should be able to add to an existing map without re-declaring existing variables :

I'd prefer not to re-declare, i'd just like to add an additional item like so :

Is this possible ?

Thanks for reading my question.

Answer 1

You can use map-merge if you first @import the variables.scss which contains the spacers declaration..

$spacers: map-merge(
    $spacers, (
        6: $spacer * 6,
    )
);

https://codeply.com/p/b9jrk23l3m