Check unknown variables on last step

[ai]

Right now we need to put postcss-mixins or postcss-for before postcss-simple-vars only because this plugin throw a error on unknow variable name.

But we can do smarter:

• We somebody install postcss-simple-vars, it will add some custom subplugin to end of plugins.
• Then it replace variables, but didn’t throw on unknown name.
• Subplugin check unused variables and throw a error if user asked.

[TrySound]

+1

[eduarddotgg]

+1

[alinnert]

Will this go beyond PostCSS? I'm using FuseBox for a project wich provides "macros". You can use them to reference assets in your CSS files that get copied to the dist folder automatically. Now of course this looks like this:

@font-face {
  font-family: Roboto;
  src: url('$assets/fonts/roboto-regular.ttf') format('ttf');
}

which leads to a problem in combination with postcss-simple-vars:

Undefined variable $assets

[ai]

@alinnert you can use postcss-use to enable postcss-simple-varsonly in some files.

[sampullman]

I can work on this one, although it would be nice to first have a version of postcss-for that doesn't complain when you use variables as parameters (currently, doing so throws External variable (not from a parent for loop) cannot be used as a range parameter). With these changes it should be possible to do:

$to: 1;
$from: 3;
@for $i from $to to $from {
    .b-$(i) { width: calc($i / $to * 100%); }
}

We can also remove the special case for @define-mixin, although both @for and @define-mixin will need special cases if we want to avoid the problem of defining e.g. $i prior to the declaration.

postcss-for-var solves this by replacing $i syntax with @i, but it would be nice to keep variable notation uniform.

[ai]

I am thinking about adding @for for a special case like @define-mixin