使用 each（） 函数生成动态类名时出现 LESS 解析错误

问：

我正在尝试使用 each（） 函数和 LESS 中的字符串插值生成动态 CSS 类名。

我尝试了以下代码：

@spacing-sizes: 0 0.25 0.5 1 1.5 3;
@breakpoints: '' 'sm' 'md' 'lg' 'xl' 'xxl';
@breakpoint-widths: 0px 576px 768px 992px 1200px 1400px;

.generate-classes(@prefix, @size, @value) {
  .loop-breakpoints(@index: length(@breakpoints)) when (@index > 0) {
    @breakpoint: e(extract(@breakpoints, @index));
    @width: extract(@breakpoint-widths, @index);
    @class-name: ~"@{prefix}-@{size}@{breakpoint}";

    & when (default(@breakpoint)) {
      @{class-name} { @prefix: unit(@value, rem) !important; }
    } 
    & when not (default(@breakpoint)) {
      @media (min-width: @width) { @{class-name} { @prefix: unit(@value, rem) !important; } }
    }
    .loop-breakpoints(@index - 1);
  }
  .loop-breakpoints();
}

.generate-sizes(@index, @size) when (@index > -1) {
  .generate-classes("m", @index, @size);
  .generate-classes("mt", @index, @size);
  .generate-classes("mb", @index, @size);
  .generate-classes("ml", @index, @size);
  .generate-classes("mr", @index, @size);
  .generate-classes("mx", @index, @size);
  .generate-classes("my", @index, @size);

  .generate-classes("p", @index, @size);
  .generate-classes("pt", @index, @size);
  .generate-classes("pb", @index, @size);
  .generate-classes("pl", @index, @size);
  .generate-classes("pr", @index, @size);
  .generate-classes("px", @index, @size);
  .generate-classes("py", @index, @size);

  .generate-sizes(@index - 1, @size);
}

.each(@spacing-sizes, .(@value, @index) {
  .generate-sizes(@index - 1, @value);
});

但是，我遇到了一个描述性不强的解析错误：

fatal error: parse error: failed at ); line: 44

我尝试了不同的方法，例如尝试不同的语法，如下所示：

each(@spacing-sizes, {
  .generate-sizes(@index - 1, @value);
});

，但我仍然收到同样的错误。