项目作者: aigis-styleguide

项目描述 :
CSS Styleguide Generator
高级语言: JavaScript
项目地址: git://github.com/aigis-styleguide/aigis.git
创建时间: 2015-05-25T12:40:45Z
项目社区:https://github.com/aigis-styleguide/aigis

开源协议:

下载


⚠️ This project is no longer maintained. ⚠️

However you can use aigis to generate styleguide.

aigis

Aigis is a Node.js package that parses comments in your CSS and auto-generate a style guide.

See the Full-documents aigis-styleguide.github.io/aigis/docs/ (This documents was generated by aigis. 🔗source

Installation

  1. $ npm install --save-dev node-aigis

You can verify node-aigis was installed correctly by running:

  1. $ ./node_modules/.bin/aigis -v
  2. $ 1.x.x

Config file & HTML Templates

aigis require “Config file” & “HTML Templates”.

  1. aigis init

This will create an aigis_config.yml file (more on this below)

  1. $ ./node_modules/.bin/aigis init
  2. Created the following files and directories:
  3. aigis_config.yml
  4. aigis_assets
  5. 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

  1. $ ./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.

  1. source:
  2. - ./lib/css
  3. - ./style.css

Initially, the configuration file contains source: aigis_assets, You can run aigis run then generate sample style guide.

Adding comments

Write following code on CSS comment block (/ ~ /)

It’s easy to add Comments. For example.

  1. ---
  2. name: base button
  3. category: module/button
  4. ---
  5. ## This is base button
  6. * Base button style.
  7. * Use `a` or `button` tag.
  8. ```html
  9. <a class="btn">Button</a>
  10. ```

Running aigis

You’re finally ready to generate a style guide!

  1. $ ./node_modules/.bin/aigis run -c ./aigis_config.yml

Then you get following output.

sample

More

See the documents