Could not resolve the variable "$pad" within "calc(100% - $pad * 2)"

[mbonaci]

If I remove the plugin it goes through without issues.

More info:

ERROR in ./src/modules/synthetics/styles/CreateStatusPage.scss (./node_modules/css-loader??ref--6-1!./node_modules/postcss-loader/lib??ref--6-2!./node_modules/sass-loader/lib/loader.js??ref--6-3!./src/modules/synthetics/styles/CreateStatusPage.scss)
Module build failed (from ./node_modules/postcss-loader/lib/index.js):
Syntax Error 

(92:9) Could not resolve the variable "$pad" within "calc(100% - $pad * 2)"

  90 |   border-bottom: 1px solid $main-border;
  91 |   height: 24px;
> 92 |   width: calc(100% - $pad * 2);
     |         ^
  93 |   margin: 0 $pad $pad;
  94 | }

The reason I was trying to include this plugin is that this doesn't produce the .info class (after I switched from react-css-modules to babel-plugin-react-css-modules) and it seems this plugin could solve the issue:

@mixin boxType($type) {

  .#{$type} {
    // ...
  }
}

@include boxType('info')

[mbonaci]

Interpolation fixed the issue:

width: calc(100% - #{$pad} * 2);

but the plugin hasn't fixed the mixin issue.

Closing.