Skip to content

villadora/helium-cli

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

21 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Helium CLI

A command-line tool to discovery unused CSS accros multiple pages based on phantomjs, which is inspired by project helium-css.

Installation

If you want a standalone cli tool, just run(highly suggest):

npm install -g helium-cli

If you already has phantomjs installed and also curl in your machine, and you really don't want to download phantomjs again due to some reason. Then you can clone this repository and remove the "phantomjs" "request" dependencies in the package.json.

Usage

Use in command-line

While you install via npm, then you can run:

helium-cli www.example.com/1 www.example.com/2  

If you already has phantomjs installed and also curl in your machine and clone the repository into your local disk. You can just run:

phantomjs helium-script.js www.example.com/1 www.example.com/2

Command Line Interface

Usage: helium-cli [options] [URLs] -- [phantomjs options]
        -A, --user-agent userAgent will be used when visit URLs
        -e, --referer Referer will be used when visit URLs
        -h, --help show help
        -v, --version show version

Use in node

Now you can use helium-cli pragmatically in node:

   var helium = require('helium-cli');
   
   helium('www.example.com', {
        useAgent: userAgent,
        __: ['arguments pass to phantomjs']
   }, function(err, data) {
        // analyse results
        // data is looks like following : 
        {
          pages: {
            "www.example.com" : {
              err: true, 
              error: new Error('...'),
              msg: 'xxx...'
            }, 
            "www.example1.com": {
              "csses": [{
                "url":"http://www.example1.com/one.css",
                "name": "one.css"
              },
              {
                "url": "http://www.example1.com/ <anonymouse inner-style:0>",
                "name": "<anonymouse inner-style>",
                "body": "...."
              }]
            }
          },
          csses: [{
            "name": "xxx",
            "url": "xxx..",
            "unused": [
                'unused selectors'...
            ],
            "pseudo_class": [
                'pseudo classes'...
            ],
            "invalid_selector": [
                'invalid selectors'...
            ],
            "unused_perc": "54.3" // percentage of unused selectors
            }, {
              "name": "xxx2",
              "url": "xxxx...",
              "err": true,
              "error": new Error('...'),
              "msg": "xxxx..."
          }]
       }
   });
   
   helium(['www.example.com', 'www.example1.com'], function(err, data) {
        // analyse results
        ...
   });
   

Options

  • userAgent string: specified userAgent used in phantomjs
  • referer string: specified referer used in phantomjs
  • __ Array.<string>: arguments will be passed to phantomjs process

TODO

  1. Error handling for webpage loading/parsing errors.
  2. Detect css selectors used in javascript.
  3. Psuedo class detect.

License

(The MIT License)

Copyright (c) 2013, Villa.Gao jky239@gmail.com; All rights reserved.

About

A tool to detect unused CSS across multiple web pages

Resources

Stars

Watchers

Forks

Packages

No packages published