Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/selo796/find-unused-css
Find unused css selectors in your project
https://github.com/selo796/find-unused-css
Last synced: 16 days ago
JSON representation
Find unused css selectors in your project
- Host: GitHub
- URL: https://github.com/selo796/find-unused-css
- Owner: selo796
- License: mit
- Created: 2016-04-27T21:53:47.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2017-04-12T22:41:43.000Z (over 7 years ago)
- Last Synced: 2024-08-01T02:27:46.184Z (3 months ago)
- Language: JavaScript
- Size: 87.9 KB
- Stars: 12
- Watchers: 2
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# find-unused-css
[](https://travis-ci.org/selo796/find-unused-css) [](https://coveralls.io/github/selo796/find-unused-css?branch=master)
[](https://www.npmjs.com/package/find-unused-css)
[](https://www.npmjs.com/package/find-unused-css)
>A npm tool to find unused css selectors in your project.
## Installation
```shell
npm install find-unused-css -g
```
## Usage
Once the module has been installed, you can run it with this command globally:
```shell
find-unused-css
```
### From config file:
Create a config file namely "*findUnusedCss.json*" with following options:
```js
{
// paths of css files for analyzing
"cssFiles": ["./dist/css/*.css"],
// path of source codes such as html or js files
"source_files": ["./pages/**/*.html", "./app/**/*.js"],
// optins for analyzing
"options" : {
"htmlAnalyzing": true|false, // default true
"tplAnalyzing": true|false, // default false
"reactAnalyzing": true|false, // default false
"jQueryAnalyzing": true|false // default false
},
// list of folders, which are excluded during analyzing
"excludes": ["./node_modules"]
}
```
### From the command line:
After running *find-unused-css* you will get two questions from command line
1. **Path of your css file:**
Enter a target css file e.g `./css/**/*.css`
2. **Path of your html directory**
Enter a path of html directory which you would like to scan for unused css selectors e.g `./pages/**/*.html`.
3. **Enable Html file analzing**
Enter 1 for enabling, 0 otherwise.
4. **Enable React analzing**
Enter 1 for enabling, 0 otherwise.
5. **Enable jQuery analzing**
Enter 1 for enabling, 0 otherwise.
Once you answered these two questions, your css selectors are scanned for given directory.
**Currently supported css selectors are `class (.class)` and `id (#id)` selectors.**
## Development
To start run `npm start` and
For unit testing just run `npm test`
## Issues
Issues can be reported on the [issue tracker](https://github.com/selo796/find-unused-css/issues).
## What is next?
- Improving the output instead of command line
- Support for attribute selectors
- Support for AngularJS
I am very happy for every feedback...
## Donation
If this project help you reduce time to develop, you can give me a cup of coffee :)
[](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=NEJ8E3YHY5AXG)