This project is no longer maintained. ⚠️
⚠️aigis
Aigis is a Node.js package that parses comments in your CSS and auto-generate a style guide.
See the Full-documents pxgrid.github.io/aigis/docs (This documents was generated by aigis. 🔗source
Installation
$ npm install --save-dev node-aigis
You can verify node-aigis was installed correctly by running:
$ ./node_modules/.bin/aigis -v$ 1.x.x
Config file & HTML Templates
aigis require "Config file" & "HTML Templates".
aigis init
This will create an aigis_config.yml
file (more on this below)
$ ./node_modules/.bin/aigis initCreated the following files and directories: aigis_config.yml aigis_assets template_ejs
Choose Template Engine
You can choose The following Template engines for generating style guide.
- EJS(
ejs
) - Jade(
jade
) - Handlebars(
hbs
)
When you run aigis init
, add --engine
option.
e.g) choose jade
$ ./node_modules/.bin/aigis init --engine jade
Config file
After aigis init
, edit aigis_config.yml
. You have to write relative path to your source files on source
.
source: - ./lib/css - ./style.css
Initially, the configuration file contains
source: aigis_assets
, You can runaigis run
then generate sample style guide.
Adding comments
Write following code on CSS comment block (/* ~ */
)
It's easy to add Comments. For example.
---name: base buttoncategory: module/button--- ## This is base button * Base button style.* Use `a` or `button` tag. ```html<a class="btn">Button</a>```
Running aigis
You're finally ready to generate a style guide!
$ ./node_modules/.bin/aigis run -c ./aigis_config.yml
Then you get following output.
More
See the documents