polish-match-stylesheet-names-to-rules

Polish plugin to flag files where the top-level selector does not match the style name.

Usage no npm install needed!

<script type="module">
  import polishMatchStylesheetNamesToRules from 'https://cdn.skypack.dev/polish-match-stylesheet-names-to-rules';
</script>

README

polish-match-stylesheet-names-to-rules

Polish plugin to flag files where the top-level selector does not match the style name. This encourages small files and componentized Sass.

Build Status

Installation

npm install polish-match-stylesheet-names-to-rules

Note that this only works for Sass & SCSS.

Example

Filename: _global_header.scss Enforced structure:

.global-header {
  ...

  ~ .button {
    ...
  }
}

Both the filename and the top-level selector are lowercased, and underscores are globally replace with hyphens, before doing a comparison.