hiloki / inkdesign

My web tech blog.
1 stars 1 forks source link

スタイルガイド #24

Open hiloki opened 11 years ago

hiloki commented 11 years ago

StyleDocco

StyleDoccoはOperaのJacob Rask氏が開発したスタイルガイドジェネレータ。

Node.js、コマンドラインで実行できるので手軽に使うことができる。

KSS

KSSはGithubのKyle Neath氏が開発したスタイルガイドジェネレータ。

Ruby実装でRubyアプリケーションで実行するのが一応前提なつくりにはなっているため、それらの経験がない場合には少し敷居が高く感じる。実際にはRakefileなり、Bundleで実行してサーバ起動すればスタイルガイドを生成することはできるが、前提環境がなければ上手く表示されないこともある。

そこでおすすめするのは、kss-nodeというNode.js実装のものがある。これであればStyleDoccoと同じような形で実行することができる。

StyleDoccoよりも高機能である分、シンタックスもやや難しいように感じるが、StyleDoccoと同じレベルで使う分にはおなじような感覚で使える。

StyleDoccoと異なる点のひとつとしてテンプレート機能がある。StyleDoccoはデフォルトのデザインテンプレート上でスタイルガイドを展開しないといけないが、KSS(kss-node)であればスタイルガイドのデザインテンプレートを独自のものにすることができる。

デフォルトのテンプレートファイルは、--initオプションで実行すると生成されるので、それをカスタマイズする。それが完成すれば、以後の実行じ--template or -tでそのテンプレートディレクトリのパスを与えればOK。これでプロジェクトのトーン&マナーにあったドキュメントをつくることができる。

Kalei

KaleiはTwitter Bootstrap風なデザインのスタイルガイドジェネレータ。 実行方法はシンプル。gitからcloneし、そのディレクトリでサーバーを起動すればいい。簡単方法はpython -m SimpleHTTPServerと叩いて、localport:8000でアクセスするのが一番容易だとおもわれる。

対象のCSSは、js/config.jsにあるcssのパスを編集すればいい。デフォルトでは/css/style.cssが参照される。

実行はシンプルだが、前者の2つとは異なり、ダイレクトにLESSやSass(SCSS)といったファイルをコンパイルしつつスタイルガイド化するというのが、ドキュメントを読む限りでは今のところできないようだ。