New Research: Supply Chain Attack on Axios Pulls Malicious Dependency from npm.Details →
Socket
Book a DemoSign in
Socket

postcss-uncss-jsdom

Package Overview
Dependencies
Maintainers
1
Versions
1
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

postcss-uncss-jsdom

Use giakki/uncss jsdom branch as a postcss plugin

latest
Source
npmnpm
Version
1.0.0
Version published
Maintainers
1
Created
Source

postcss-uncss

npm npm

Use giakki/uncss jsdom branch as a PostCSS plugin.

About

UnCSS is a tool that removes unused CSS from your stylesheets. It works across multiple files and supports Javascript-injected CSS.

Example:

html:

<body>
  <p class="red">Hello World!</p>
</body>

css before:

.red {
  color: red;
}
.blue {
  color: blue;
}

css after:

.red {
  color: red;
}

How?

The HTML files are loaded by jsdom and JavaScript is executed. UnCSS filters out selectors that are not found in the HTML files.

See the UnCSS docs for more information.

Installation

postcss-uncss-jsdom specifies UnCSS-jsdom as a peerDependency, so you will have to install UnCSS-jsdom as well.

npm install postcss-uncss-jsdom uncss-jsdom

postcss-uncss-jsdom's MAJOR & MINOR version numbers correspond to UnCSS-jsdom's version numbers; however, the PATCH version number may differ.

Usage

postcss([ require('postcss-uncss') ])

See PostCSS docs for examples for your environment.

Options

  • html (Array): provide a list of html files to parse for selectors and elements. Usage of globs is allowed.

  • ignore (Array): provide a list of selectors that should not be removed by UnCSS. For example, styles added by user interaction with the page (hover, click), since those are not detectable by UnCSS yet. Both literal names and regex patterns are recognized. Otherwise, you can add a comment before specific selectors in your css:

    /* uncss:ignore */
    .selector1 {
        /* this rule will be ignored */
    }
    
    .selector2 {
        /* this will NOT be ignored */
    }
    

Example Configuration

{
  html: ['index.html', 'about.html', 'team/*.html'],
  ignore: ['.fade']
}

Keywords

postcss-plugin

FAQs

Package last updated on 02 Feb 2017

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts