GruntでLESSをコンパイルしてBootstrapをカスタマイズ

概要

Bootstrap3 LESSのカスタマイズ -環境設定編 | ajike switch
を参考に作業を進めてみます。

以前のYeomanインストールでGruntの環境は出来上がっているので、bootstrapの設定から参ります。

bootstrapの設定

1. githubのページ「twbs/bootstrap · GitHub」からbootstrapをダウンロードします。
   （もちろんgitコマンドでcloneしてもイイですよ＾＾）
   bootstrap-masterフォルダの中にファイルがいっぱい。
2. ターミナルで「cd」コマンドを使い、bootstrap-masterフォルダまで移動します。
3. Grunt実行のコマンド入力します。
   $ grunt watch
   を入力するだけで、Gruntの監視がはじまります。

のはずだったのですが・・・結果は

$ grunt watch
grunt-cli: The grunt command line interface. (v0.1.11)

Fatal error: Unable to find local grunt.

If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project. For more information about
installing and configuring grunt, please see the Getting Started guide:

http://gruntjs.com/getting-started

gruntが見付からないよってことかな？

http://gruntjs.com/getting-started
をみても、なんとなくしか分からない...orz

Web制作で面倒な作業を自動化するビルドツール、Grunt v0.4 入門｜Web Design KOJIKA17
を参考に行けるとこまでいってみよう！

〜関連ページ〜

1. Bootstrapでスマホサイト制作
2. GruntでLESSをコンパイルしてBootstrapをカスタマイズ
3. 改めて、Grunt.jsをインストール
4. 改めて、GruntでLESSをコンパイルしてBootstrapをカスタマイズ
5. 〜まとめ〜 GruntでLESSをコンパイルしてBootstrapをカスタマイズ