unused-classes

0.1.0 • Public • Published

unused-classes

Purpose

Finds out possibly unused class selectors (.my-class) and id selectors (#my-element) by statically analyzing the source code that generates HTML.

Currently Erb and Haml are supported.

Getting started

Install

npm install -D unused-classes
# OR
yarn add -D unused-classes

Configure

touch .classnamesrc.js

Configuration example

module.exports = {
  rules: [
    {
      include: ["app/views/**/*.haml"],
      parser: "haml",
    },
    {
      include: ["app/views/**/*.html.erb"],
      parser: "erb",
    },
  ],
  output: "classes.json",
};

Configure a script in package.json:

{
  "scripts": {
    "unused-classes": "unused-classes"
  }
}

Running

npm run unused-classes
# OR
yarn unused-classes

Then ./classes.json will be generated. You can use the data with the following packages:

Advanced usage

known-classes parser

Use known-classes parser to tell which class names / ids are autogenerated:

module.exports = {
  rules: [
    {
      include: ["dynamically-generating-code.js"],
      parser: "known-classes",
      options: {
        known: [".foo", "#bar"],
      },
    },
  ],
};

Then it checks for the occurrences of foo and bar in the specified files and if there are, it records .foo and #bar as used.

externals

Explicitly tell unused-classes about externally inserted classes:

module.exports = {
  externals: {
    "typeahead": [
      ".tt-dropdown-menu",
      ".tt-hint",
    ],
  },
};

Wildcards

not supported yet

Versions

Current Tags

  • Version
    Downloads (Last 7 Days)
    • Tag
  • 0.1.0
    46
    • latest

Version History

  • Version
    Downloads (Last 7 Days)
    • Published
  • 0.1.0
    46

Package Sidebar

Install

npm i unused-classes

Weekly Downloads

46

Version

0.1.0

License

MIT

Unpacked Size

12.1 kB

Total Files

12

Last publish

Collaborators

  • qnighy
  • wantedly_dev