csstools/postcss-advanced-variables

Could not resolve the variable

h0tc0d3 opened this issue · 1 comments

precss:modules.css:19:23: Could not resolve the variable "$name" within "button $name, $color"
 17 | }
  18 | 
> 19 | @define-mixin button $name, $color {
     |                       ^
  20 |     .button-$name {
  21 |         @extend %button;

    at Input.error (node_modules\postcss\lib\input.es6:90:22)
    at AtRule.error (node_modules\postcss\lib\node.es6:86:38)
    at manageUnresolved (node_modules\precss\node_modules\postcss-advanced-variables\index.bundle.js:52:14)
    at node_modules\precss\node_modules\postcss-advanced-variables\index.bundle.js:73:4
    at String.replace (<anonymous>)
    at getReplacedString (node_modules\precss\node_modules\postcss-advanced-variables\index.bundle.js:59:30)
    at transformAtrule (node_modules\precss\node_modules\postcss-advanced-variables\index.bundle.js:144:16)
    at node_modules\precss\node_modules\postcss-advanced-variables\index.bundle.js:694:5
    at Array.forEach (<anonymous>)
    at transformNode (node_modules\precss\node_modules\postcss-advanced-variables\index.bundle.js:666:22)

Code:

@define-mixin button $name, $color {
    .button-$name {
        @extend %button;
        background-color: $color;
        color: #fff;
    }
    .button-$name:hover {
         background-color: @background-color;
         color: $color;
    }
}

@define-mixin is no longer bundled with precss, and postcss-advanced-variables handles mixins like Sass, using the at-rule name @mixin.