If you are not redirected automatically, visit the new Radium homepage at formidable.com/open-source/radium.
一昨日実験を行ったCSSプリプロセッサやポストプロセッサで出力されたCSSの整形をGrunt.jsで実行できるプラグイン、grunt-cssprettyを作成しましたので本日公開いたします。 使用方法 npm install --save-dev grunt-cssprettyを実行し、プラグインをインストールします。その後、gruntfile.jsやgruntfile.coffeeにて設定を行います。 オプション解説 以下のオプションが設定可能です。変更が必要なオプションのみ記載して下さい。記述がないオプションは、srcで指定されたCSSファイルのフォーマットでそのまま出力されます(そのため、ほぼ全てのプロパティに初期値を指定していません)。 なお、''は改行も空白も入れないことを意味しますので注意して下さい。 decl.before 型 String 初期値 なし CSSプロパティ名の
スタイルシートの統計情報を出力するNode Packageを作った。 t32k/stylestats Node.js 0.10以上が必要で、CLIだとこんな感じの情報を出力してくれる。 $ npm install -g stylestats $ stylestats path/to/stylesheet.css StyleStats! ┌────────────────────────┬──────────┐ │Size │ 498.0B │ ├────────────────────────┼──────────┤ │Rules │ 7 │ ├────────────────────────┼──────────┤ │Selectors │ 11 │ ├────────────────────────┼──────────┤ │Simplicity │ 63.64% │ ├───────
StyleDoccoはスタイルシート中に書いた設定をドキュメント化するソフトウェアです。 Webデザインにおいてスタイルシートは欠かせません。Webサイトのスタイルシート設定をドキュメントにしたい時に使いたいのがStyleDoccoです。 インストールします。 デモです。右側にスタイルシート、左側にその説明が表示されています。 HTMLのコーディング方法と、その結果とかが上下に並んで表示されます。 リスト表示などもあります。 スマートフォンの幅に指定することもできます。 レスポンシブWebデザインの場合は便利そうです。 Bootstrapで作られたデモもあります。 ボタンのデザイン。こうやって表示されると分かりやすいですね。 StyleDoccoを使うとCSSファイル中に書いた設定の使い方をそのままドキュメントにできるようになります。書き方と実際に適用した結果が分かれば、Webデザイナーの
programming notes. mainly about JavaScript / jQuery. [@Takazudo] [takazudo@gmail.com] Hint: alt + / ※ この記事はgrunt version 0.2.x のもので、grunt 0.3 からはAPIが変更されています grunt というJS/CSSのビルドツールが便利だったので紹介します。(Mac/Linux) cowboy/grunt - GitHubこのgruntってのは、JS,CSSを全部まとめて繋げる、まとめてJS lintする、minifyする見たいのをタスクとして登録しておくと、それ実行すればちゃちゃっとやってくれちゃうやつです。さらにwatchっていう機能使えば、ファイルが更新されたらそのタスクをやってくれるみたいなのも。 似たモノで、MakeとかRakeとかCakeとかそういう
Gruntってアレですね、JSでホゲホゲっと設定ファイルを書いてJSとかCSSのファイルをminify/unifyとかするヤツです。 最近よく聞くので、機会があったら使ってみようと思っていたのですが、最近とあるウェッブページをPlay!Frameworkで作ってみたりしていたので、それのJS/CSSのビルドに使ってみました。 もろもろやりたいことを実現したらこんな感じに。本当はもうちょっと綺麗に書けるのではないかと思います。 https://gist.github.com/3738650 僕のやりたかったことは、 JS/CSSのunify JS/CSSのminify JS/CSSのgzip (for Play!) timestampをつけたファイル名の生成 作成されたfileどものclean conf, templateの文字列置換。@@timestampをtimestampに置換するなど
clean-cssはnode.jsを使ったCSS短縮化ソフトウェアです。コンソールで動作します。 一日数十万、数百万とアクセスのあるWebサイトではほんの少しの改善が積み重なって大きな速度改善につながることもあります。CSSも作成したそのままではなくちょっと工夫すれば大きな負荷軽減につながるかも知れません。そのための短縮化ライブラリがclean-cssです。 インストールはnpmを使って一発で完了。コマンドとして使うので-gをつけておきます。 ヘルプです。-oでアウトプットするファイル名、後は入力ファイルを指定するだけです。 catで標準出力としてCSSの記述を渡すことで、複数のファイルをまとめてマージして短縮化もできます。 元ファイルです。 こんな感じで短縮化されます。 またnode.jsのライブラリとしてテキストでCSSを渡して短縮化もできます。 -oをつけないと標準出力に渡るので、さ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く