Check if assigned CSS vars are actually used

This commit is contained in:
Jeremy Thomas 2020-08-23 13:15:42 +02:00
parent 64b89dbc63
commit 4cb72c225a
2 changed files with 22 additions and 11 deletions

View File

@ -57,7 +57,7 @@ $panel-colors: $colors !default
border-radius: var(--panel-radius) border-radius: var(--panel-radius)
box-shadow: var(--panel-shadow) box-shadow: var(--panel-shadow)
font-size: $size-normal font-size: var(--panel-font-size)
&:not(:last-child) &:not(:last-child)
margin-bottom: var(--panel-margin) margin-bottom: var(--panel-margin)
// Colors // Colors

View File

@ -143,35 +143,46 @@ function plugin() {
const {fileName, lines} = utils.getLines(files, filePath); const {fileName, lines} = utils.getLines(files, filePath);
const file = files[filePath]; const file = files[filePath];
const contents = file.contents.toString(); const contents = file.contents.toString();
let assignments = contents.match(regexAssign); const assignments = contents.match(regexAssign);
if (!assignments) { if (!assignments) {
logThis(`${filePath} has no CSS var assignments`); logThis(`${filePath} has no CSS var assignments`);
return; return;
} }
assignments = assignments.map(assignment => assignment.replace(':', '')); const fileAssignments = assignments.map(assignment => assignment.replace(':', ''));
assignments = [...assignments, ...DEFAULT_ASSIGNMENTS]; const allAssignments = [...fileAssignments, ...DEFAULT_ASSIGNMENTS];
const usages = contents.match(regexUsage);
let usages = contents.match(regexUsage);
if (!usages) { if (!usages) {
logThis(`${filePath} has no CSS var usages`); logThis(`${filePath} has no CSS var usages`);
return; return;
} }
// var(--foobar) ==> --foobar
usages = usages.map(usage => {
usage = usage.replace('var(', '');
usage = usage.replace(')', '');
return usage;
});
let errorCount = 0; let errorCount = 0;
usages.forEach(usage => { usages.forEach(usage => {
// var(--foobar) ==> --foobar if (!allAssignments.includes(usage)) {
let varName = usage.replace('var(', '');
varName = varName.replace(')', '');
if (!assignments.includes(varName)) {
console.log(`${usage} is not assigned`); console.log(`${usage} is not assigned`);
errorCount++; errorCount++;
} }
}); });
fileAssignments.forEach(assignment => {
if (!usages.includes(assignment)) {
console.log(`${assignment} is not used`);
errorCount++;
}
});
if (errorCount) { if (errorCount) {
console.log(`There are some errors in ${filePath}`); console.log(`There are some errors in ${filePath}`);
} else { } else {
@ -182,7 +193,7 @@ function plugin() {
if (hasErrors) { if (hasErrors) {
console.log(`There are some errors`); console.log(`There are some errors`);
} else { } else {
console.log(`All used CSS variables are assigned correctly!`); console.log(`All CSS variables are used and assigned correctly!`);
} }
}; };
} }