Help: fill does not work when using @value to pass variables

[olabala]

here is my css:

@value themeColor from 'index.css';

.icon {
  height: 1.45em;
  width: 1.45em;
  background: svg-load('back.svg', fill: themeColor) no-repeat left center;
  background-size: contain;
  padding-right: 0.36em;
  color: themeColor;
  cursor: pointer;
}

after rendering:

    height: 1.45em;
    width: 1.45em;
    background: url(data:image/svg+xml;charset=utf-8,%3C?xml version='1.0' encoding='UTF-8'?%3E…4.45,525.9 751.95,525.9 L328.35,525.9 Z' id='back'/%3E %3C/g%3E %3C/svg%3E) no-repeat left center;
    background-size: contain;
    padding-right: 0.36em;
    color: #ee4d2d;
    cursor: pointer;

fill failed to read variable themeColor's value, so i want to figure out if there are any wrong in my css code ???

[hudochenkov]

In your PostCSS plugins chain, plugin, which is replacing themeColor for it's actual value, should be running before postcss-inline-svg.