В общем, сам спросил -- сам ответил.
Делается это так:
устанавливаем
npm install svg-fill-loader --save1. в конфиге вебпака прописываем правило для svg:
{
test: /\.svg((\?.*)?|$)/,
loaders: [
'url-loader',
'svg-fill-loader?selector=.svg-fill' // `selector` option will be used for all images processed by loader
]
},
2. делаем миксин в файле с переменными scss:
$main-color: red;
@mixin apply-background-image($url, $color) {
$base-color: str-slice(inspect($color), 2);
background-image: unquote('url("' + $url + "?fill=%23" + $base-color +'")');
}
3. в файле svg прописываем класс .svg-fill для всего svg или path (path class="svg-fill")
4. и делаем подстановку цвета в style.scss:
item {
@include apply-background-image("./../assets/svg/item.svg", $main-color);
}