To będzie odpowiedź niekonwencjonalny jak wydaje się, że dane te nie są ujawniane publicznie jako część interfejsu API przeglądarki.
tl; dr
- Zapisz lokalna kopia pliku
less.js
.
Dodaj tę definicję funkcji gdzieś
function exposeVars(root) {
var r=root._variables,n=Object.keys(r),m={}
for(var k of n){m[k]=r[k].value}
less.variables = m;
}
Dodaj następujące połączenia exposeVars(evaldRoot)
tuż przed return result
na linii ~ 2556.
- Teraz
less.variables
zawiera wszystkie zmienne z Twojego pliku.
Oświadczenie: To nie jest dobry pomysł! W porządku, jeśli po prostu bawisz się, debugujesz lub testujesz coś, ale nie polegaj na tym hackerze na nic poważnego!
Podstawowym celem tutaj było znaleźć punkt w źródle, gdzie .less
pliki zostały przekształcone drzewo składniowe (lub innej struktury formalnej).
Wskakując prosto do źródła, znalazłem klasę ParseTree
. Rozsądnym jest przypuszczenie, że będzie zawierał wynik analizy mniejszego pliku.
Napisałem szybki plik testowy i dodałem go do przeglądarki z odpowiednim znacznikiem. Wygląda to tak:
@myvar: red;
@othervar: 12px;
body {
padding: @othervar;
background: @myvar;
}
Pobrałem lokalną kopię less.js i dodaje punkt przerwania dodany do linii 2556.
ja miał grzebać w zakresie lokalnym, aby zobaczyć, co było dostępne i znaleźć zmienne w obiekcie o nazwie evaldRoot
.
evaldRoot = {
_variables: {
@myvar: {
name: '@myvar',
value: Color
},
@othervar: {
name: '@othervar',
value: Dimension
}
}
}
Następnym zadaniem było ustalenie, gdzie znajdują się te dane. Wygląda na to, że zmienna evaldRoot
jest używana do generowania wynikowego CSS (co ma sens, ponieważ zawiera informacje takie jak zmienne).
if (options.sourceMap) {
sourceMapBuilder = new SourceMapBuilder(options.sourceMap);
result.css = sourceMapBuilder.toCSS(evaldRoot, toCSSOptions, this.imports);
} else {
result.css = evaldRoot.toCSS(toCSSOptions);
}
Cokolwiek się zdarzy, zmienne wychodzi z zakresu po to służy do generowania ciąg CSS jako result.css
.
Aby odsłonić te zmienne, skrypt wymaga niewielkiej modyfikacji. Będziesz musiał publicznie ujawnić te zmienne. Oto przykład tego.
function exposeVars(root) {
var varNames = Object.keys(root._variables);
var variables = varNames.reduce(function(varMap, varName) {
varMap[varName] = root._variables[varName].value;
}, {});
less.variables = variables;
}
Można to dodać bezpośrednio przed instrukcją return z punktem przerwania.
exposeVars(evaldRoot);
return result;
Teraz zmienne będą dostępne w name: value
obiektu na światowym less
obiektu.
Można nawet zmodyfikować funkcję wystawiać na powrót zmienne z wywołania less.getVars()
. Tak jak twoja początkowa sugestia.
function exposeVars(root) {
// ...
less.getVars = function() {
return variables;
};
}
dobrze wszystkie zmienne zaczynają się od '@' nie wiem, czy coś mniej ofert, ale można dość dużo wykonać wyrażenie regularne i znaleźć wszystkie zmienne – Gntem
Znajdź gdzie? Muszę załadować je do zmiennej, na przykład – Gena
Hmm, nie rozumiem, dlaczego to może nie jest idealne, ale wciąż doskonale prawidłowe pytanie zostało zawieszone. Czy co najmniej jeden z bliskich wyborców ma pojęcie o tym, czym jest Less? Głosuję za ponownym otwarciem. –