Why do I get a Syntax Error: SassError: expected "{"?

Question

The example given by the sass map.set documentation doesn't work, why is that?

@use "sass:map";

$font-weights: (
  'regular': 400,
  'medium': 500,
  'bold': 700
);

map.set($font-weights, 'extra-bold', 900);
// ("regular": 400, "medium": 500, "bold": 700, "extra-bold": 900)
map.set($font-weights, 'bold', 900);
// ("regular": 400, "medium": 500, "bold": 900)

My sass version is 1.32.5.
The entire error message:

Syntax Error: SassError: expected "{".
  ╷
9 │ map.set($font-weights, 'extra-bold', 900);
  │                                          ^
  ╵
  src\assets\styles\variables.scss 9:42  @import
  src\assets\styles\main.scss 4:9        root stylesheet

I expect the map to be set without throwing errors.

Answer 1

Problem 1 (If you are using map.set, please skip to problem 2)

Actually, I was using map-set the whole time, I thought map-set is the same as map.set, turned out it's not.

In Sass's doc Built-In Modules:

Before the Sass module system was introduced, all Sass functions were globally available at all times. Many functions still have global aliases (these are listed in their documentation). The Sass team discourages their use and will eventually deprecate them, but for now, they remain available for compatibility with older Sass versions and with LibSass (which doesn’t support the module system yet).

And map.set doesn't have a global map-set like map.merge does (map-merge).

Problem 2

Also, I thought map.set would act like JavaScript's Map.prototype.set(), by which you set a map like map.set(key, value) without assigning it to a variable will work. In Sass, I had to do:

@use "sass:map";

$map: ();
$map: map.set($map, key, value);

Why @debug "didn't work" for me

Mostly I'm using Sass under the vue-cli environment. Sass's @debug syntax "never had" any output visually, it turned out they're actually outputted, I just have to scroll up a bit: