具有mixin和函数的Sass可重用关键帧

我有四个看起来非常相似的关键帧。我能做一个mixin或函数并使用它而不是复制我的代码吗？关键帧类似于：

@keyframes ComputerLogoOuterSquare {
  0% {
    transform: translate(0, 0);
  }

  12% {
    transform: translate(0.5%, 0.5%);
  }

  50% {
    transform: translate(0.5%, 0.5%);
  }

  62% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(0, 0);
  }
}

我尝试了mixin，但它抛出了一个错误：

@mixin logoAnimation($name, $value) {
  @keyframes $name {
  0% {
    transform: translate(0, 0);
  }

  12% {
    transform: translate($value, $value);
  }

  50% {
    transform: translate($value, $value);
  }

  62% {
    transform: translate(0, 0);
  }

  100% {
    transform: translate(0, 0);
  }
  }
}

---

使用插值来使用$name like

@关键帧#{$name}

---

它抛出的错误可以共享it@Ronak07它来自linter“code”：“css identifierexpected”，它在

@keyframes$name

处加下划线

$name