scss 编译错误 no mixin named transalate 属性答案

【问题标题】：scss compile error no mixin named transalate propertyscss 编译错误 no mixin named transalate 属性
【发布时间】：2019-07-25 16:43:26
【问题描述】：

没有名为过渡的mixin 编译后我在这里收到此错误代码

这个错误代码

{
“状态”：1，
“文件”：“/Users/chetandhargalkar/Documents/medino/assets/sass/layout/_header.scss”， “行”：36，
“列”：30，
"message": "没有名为转换的 mixin",
"formatted": "Error: no mixin named transition\n on line 36 of assets/sass/layout/_header.scss\n from line 11 of assets/sass/main.scss\n>> @include transition(all .3s缓入出)\r\n -----------------^\n"
}

这是我的代码

.social-links {
  ul {
    float: right;
    margin-top: 5px;
    li {
      display: inline;
      margin-left: 15px;
      a {
        color: $body-text;
        @include transition(all .3s ease-in-out);
        &:hover {
          color: $primary-color;
        }
      }
    }
  }
}

【问题讨论】：

标签： html css scss-mixins

【解决方案1】：

Transition 不是一个 mixin，它是一个标准的 CSS 属性。替换这个：

@include transition(all .3s ease-in-out);

用这个：

transition: all .3s ease-in-out;

【讨论】：

【解决方案2】：

如果你真的想使用 mixin，你可以创建一个，你可以在你的主题的任何地方使用它。

@mixin transition($val, $timer, $ease) {
    transition: $val $timer $ease;
}

像这样使用：

a {
  @include transition(all, .3s, ease-in-out);
}

或者只使用常规的 css：

a {
  transition: all 300ms ease-in-out;
}

【讨论】：