公式ドキュメントやコードから理解するGrunt入門 - interprism's blog
こんにちは、kannoです。 流行のGruntを入門してみて便利だなと思ったものの、いくつか分からない点がありました。 なぜgrunt-cliとgruntを別々にインストールする必要があるのか なぜgrunt-cliはグローバル(-g)インストールで、gruntはそうでないのか package.jsonは必要なのか プラグインを使わずに独自でタスク定義する方法 そもそもgruntはどういう風に動いているのか registerTaskの引数の指定の仕方の違い initConfigの書き方はどういうルールか registerTaskとregisterMultiTaskの違い プラグインを使うためのloadNpmTasksは何をしているのか 分からないまま使うのは気持ち悪い。ということで調べてみました。 想定読者 Gruntを使ったことがあるor何となく見聞きしたことがある ネットからコピペして
[grunt] ファイル保存したタイミングで、ブラウザを自動的にリロードして、確認作業をスピードアップさせよう - YoheiM .NET
[grunt] ファイル保存したタイミングで、ブラウザを自動的にリロードして、確認作業をスピードアップさせよう こんにちは、@yoheiMuneです。 HTMLやCSSやJSなどのフロントエンド開発を効率的に行いたい。そんな目標のもと、今回はgruntJSを使ってファイル保存したタイミングで、自動でブラウザリロードしてソースの変更内容を即座に確認する方法をブログに書きたいと思います！ ※2014/02/05更新 grunt-regardeではなくgrunt-contrib-watchでも出来るようになったので、記載を修正しました。 gruntJSのセットアップ gruntJSは、 CSSプリプロセッサのコンパイル、JSファイルの結合などフロントエンドの開発で行うビルド作業を行うためのツールです。 まずはgruntjsが使えるようにセットアップを行います。 nodeとnpmを利用しますので、
![[grunt] ファイル保存したタイミングで、ブラウザを自動的にリロードして、確認作業をスピードアップさせよう - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/45f422e34884f17dd5343674c46ba504c2dca97c/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F227.jpg)
Gruntの導入メモ
Gruntを使ってみて便利だったのでメモ。 1. Grunt-CLIインストール macで作業する前提です。 投稿時のバージョン grunt-cli v0.1.6 grunt v0.4.1 Gruntはnode.jsのパッケージマネージャーnpmでインストールします。 事前にnode.jsのインストールが必要ですがここでは割愛。 以前のバージョン(0.3.x.)のGruntが入っている場合はアンインストールしておきます。 $ sudo npm uninstall -g grunt そしてインストールします。 $ sudo npm install -g grunt-cli 2. プロジェクトの作成&準備 プロジェクトのフォルダを作成します。ここでは例として「grunt-test」とします。 そしてターミナルで作成したフォルダへ移動します。 $ cd path/to/grunt-test ma
Grunt 日本語リファレンス | js STUDIO
このサイトについて Gruntの日本語リファレンスです。 Gruntの本家サイト(英文) の内容を翻訳して作成していますが、誤訳や誤記があると思いますのでその点についてはご了承ください。 もし、誤訳などの間違いを見つけましたら、 @tomof まで教えていただければ幸いです。 News 2013.04.15 サイトをオープンしました。 概要 何故タスクランナーを使うのか？ 一言で言えば、自動化のためです。 ファイル圧縮、コンパイル、単体テスト、Lintなどの繰り返し実行しなければいけないタスクを自動化することで、仕事を楽にしてくれます。 タスクランナーを設定すれば、こういった冗長的なほとんどの仕事を、あなたやチームのために行なってくれます。 何故Gruntなのか？ Gruntエコシステムは、巨大で日々成長しています。 Gruntを使って文字通り何百ものプラグインから選択し、最小限の努力で自
[JS] Compass(Scss)のビルドが遅いので、マルチスレッドで高速でCompassビルドするgruntタスクを作ってみました - YoheiM .NET
[JS] Compass(Scss)のビルドが遅いので、マルチスレッドで高速でCompassビルドするgruntタスクを作ってみました こんにちは、@yoheiMuneです。 Compass(Sass)を仕事で使うのですが、@extendとかがいっぱいあるとビルドに時間がかかるようになってきました。 今回は、その対策としてgruntのタスクとして、compassビルドをマルチスレッドで高速化するタスクを作ったので、紹介させて頂きたいと思います。 Compassのビルドは時間がかかる？ Compassってすごく便利なツールで、CSSをモジュールか出来たり案件ごとに使い回したりして、CSSのコーディングの効率化が出来ます。 でも、画像のBase64化やSprite化、@extendで共通Compassモジュールを使うコードなどが増えると、コンパイルに時間がかかってきます。 自身が関わっている案
![[JS] Compass(Scss)のビルドが遅いので、マルチスレッドで高速でCompassビルドするgruntタスクを作ってみました - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/be8a85a78049a62f12c7fca35a7418bb8dcd8564/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F217.jpg)
sass(compass)とgruntで複数バリエーションのCSSを同時書き出し - forty4.jp
この用途がどれほど必要とされるかはわからないが、今の自分が直面している問題の解決のために必要だったことが、sass(compass)とgruntを使うことでどうにか実現できたので、メモがてら残しておこうと思う。 解決したかったこと CSS内から呼ぶ画像パスのルートが違うだけの２種類のCSS作成を運用として回さなくてはならなくなったが、パスの修正漏れやそもそも修正の反映漏れ等が懸念される。 それを１度の修正で同時に修正できる様に解決したかった。 準備したもの（以下はすべて Windows7 環境下） Ruby 1.9.3 Sass 3.2 Compass 0.12 Node.js 0.8.2 Grunt 0.4 grunt-contrib-compass ※これらのインストール等は他ブログ等で調べてください。といっても、インストーラーとコマンド３回打つだけですけど、、、 どう実現したか 結論
Takazudolog - Grunt v0.4.0 での変更点
Grunt がめでたく version 0.4.0 になりました。version 0.3.xからの変更点をざっくり。自分で昔書いたタスクを書きなおす上で必要だったことのみですけど。 箇条書きで書くとこんなかんじでした。 ドキュメントがめっちゃ親切になった Grunt本体はグローバルにインストールされなくなった grunt-cliのみをグローバルにインストールすればOK ビルトインのタスクは全てnpm moduleになった Grunt本家がビルトインで存在していたタスクをnpm moduleとして用意した コンフィグのファイルはgrunt.jsではなく、Gruntfile.js及びGruntfile.coffeeになった コンフィグのファイル及びタスクはCoffeeScriptで書いても良くなった タスク内でイベントが使えるようになった テンプレート機能が改善 registerHelperが
Web Design Tips To Help You Succeed - Web Design
Understanding 해운대고구려 Facebook Marketing Works Having a really good해운대고구려 item may certainly not be actually a guarantee for excellent purchases. It’s achievable for you to possess wonderful service or products,… [더 보기] Just howCrucial 해운대룸싸롱 The Right Diabetes Mellitus Diet? There is actually해운대룸싸롱nothing more important than the best diabetes diet regimen. Diabetic issues is actually a major disea
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
GitHub - gruntjs/grunt-contrib-connect: Start a static web server.
SSSSLIDE