extract-components

This is a proof-of-concept. some quick and dirty utils for extracting UI components from HTML using CSS selectors.

Install

Install globally with npm:

npm i -g extract-components --save-dev

For a quickstart, try running:

extract "test/fixtures/*.html" .carousel

The results will be saved to examples/carousel. This will extract the carousel component from Bootstrap's HTML (found in test/fixtures).

The results will be saved to examples/carousel. Open it in the browser to see what this does ;-)

You can also just run node index to use the defaults. This first searches through Bootstrap's LESS files and parses out CSS classes, then those classes are used to find components so we can extract them from the HTML.

Usage

The CLI is a WIP. It currently takes four arguments:

extract [src] [selector] [dest] [ext]

• src: (-s | --src) the filepaths or globbing patterns for the file(s) to parse, e.g. test/fixtures/*.html
• selector: (-c, for "component" | --selector) the component selector, e.g. use .carousel to extract the carousel component.
• dest: (-d | --dest) (optional, default is temp): the destination directory for extracted components, e.g. temp
• ext: (-e | --ext) (optional, default is .html): dest extension to use for dest components, e.g. .hbs

Author

Jon Schlinkert

• github/jonschlinkert
• twitter/jonschlinkert

License

Copyright (c) 2014 Jon Schlinkert, contributors.
Released under the MIT license

This file was generated by verb-cli on April 17, 2014.