Можно ли установить значение переменной sass в зависимости от записи в веб-пакете? У меня в данный момент есть следующие точки входа в мой webpack.config.js
:
var config = {
entry: {
'entry1': ['./app.scss'],
'entry2': ['./app.scss'],
'entry3': ['./app.scss'],
...
Я использую sass-loader
и попытался создать функцию, которая может загружать значения из файла js:
const sassVars = require(__dirname + "/sass/theme.js");
...
loader: "sass-loader",
options: {
sourceMap: !isProductionMode,
functions: {
"get($keys)": function(keys) {
keys = keys.getValue().split(".");
let result = theme;
let i;
for (i = 0; i < keys.length; i++) {
result = result[keys[i]];
if (typeof result === "string") {
result = convertStringToSassDimension(result);
} else if (typeof result === "object") {
Object.keys(result).forEach(function(key) {
const value = result[key];
result[key] = convertStringToSassDimension(value);
});
}
}
result = sassUtils.castToSass(result);
theme = sassVars.themes[themeIndex++];
return result;
}
}
}
Это затем используется внутри моих файлов .scss следующим образом:
$primary-color: get('color.primary')
Все работает, и я могу загрузить значения переменных из моего файла theme.js. Но мне нужно иметь возможность загружать разные значения в зависимости от моей точки входа.
например
entry1:
get('color.primary') => #ff0000
запись 2:
get('color.primary') => #0000ff
Любые предложения о том, как я могу получить доступ к имени записи в моей функции sass-loader? Или я подхожу к этому неправильно?