What I want to achieve
I want to detect when the class name of the general CSS library and the class name declaration of my CSS file are duplicated (On the editor of PHPStorm, Atom, VSCode, etc).
Is there a way to detect in the HTML file if the class name is duplicated?
What I examined (but they are useless)
So I searched for CSS Lint and found CSS LINT and stylelint.
However, it seems that CSS LINT does not have a function to detect duplicate class names, and the following CSS did not issue any errors or warnings.
.duplicate_class {
background: #ffa;
}
.duplicate_class {
font-size: 5px; /* I want errors and warnings */
}
stylelint's no-duplicate-selectors check selectors instead of class names, thus allowing duplicate class names:
.class {
background: #ffa;
}
body .class {
font-size: 5px;
}
Of course, htmllint didn't have the ability to detect duplicate class names.