grunt 便利ですね!
でもいちいちインストールするのめんどくさいんです!時間の浪費、ではなく、めんどくさいんです!
ということで、grunt のインストールから初回 grunt 実行まで一発で終わらせるシェルスクリプトです。あ、毎度のことながら Mac 環境です。Windows は分かりません!
やりたいこと
- grunt のインストール
- 必要なファイルを作業フォルダに格納
- 初回 grunt
ということで、まず一式格納するコピー元となるフォルダを、例えばどこかに「grunt」という名前で作るとします。
各種必要なファイルを格納する
この「grunt」に以下のファイルを置いておきます。開発を始めるときの初期ファイルです。
- config.rb
- Gruntfile.coffee
- package.json
- README.md
- 各種 .sass
- 各種 .coffee
- 各種ウェブフォントのリソース
- 各種 .py など
「grunt-play」は astronaughts さんの grunt 実行後に音で教えてくれる神プラグイン、「mplus-1p-regular.ttf」はぼくがよく使う M+WEBFONTS さんのウェブフォント、「WebIconFonts」群は chibatch さんの Web Icon Fonts で使うウェブフォント、「fontello」群は fontello さんのウェブフォントです。
Gruntfile.coffee の中身は Gruntfile.coffee の中身をまとめてみた - Qiita をご覧ください。
grunt.command を作る
これを、grunt.command として「grunt」フォルダ内に格納します。
# !/bin/bash
sudo npm install -g grunt-cli
grunt_dir='/どこか/grunt/'
cp "${grunt_dir}config.rb" "${grunt_dir}Gruntfile.coffee" "${grunt_dir}package.json" "${grunt_dir}README.md" ./
sudo npm install grunt-contrib-coffee grunt-contrib-compass grunt-contrib-concat grunt-contrib-copy grunt-contrib-cssmin grunt-contrib-uglify grunt-este-watch grunt-play grunt-slim grunt-ssh --save-dev
mkdir css src js
cp "${grunt_dir}_include.sass" "${grunt_dir}common.sass" "${grunt_dir}fonts.sass" "${grunt_dir}mobile.sass" "${grunt_dir}reset.sass" "${grunt_dir}tablet.sass" ./src/
cp "${grunt_dir}desktop.coffee" "${grunt_dir}functions.coffee" "${grunt_dir}mobile.coffee" ./src/
cp "${grunt_dir}common.html" "${grunt_dir}config.yml" "${grunt_dir}data.py" "${grunt_dir}functions.py" "${grunt_dir}index.html" "${grunt_dir}index.py" "${grunt_dir}index.slim" "${grunt_dir}view.py" ./src/
cp "${grunt_dir}fontello.eot" "${grunt_dir}fontello.svg" "${grunt_dir}fontello.ttf" "${grunt_dir}fontello.woff" "${grunt_dir}mplus-1p-regular.ttf" "${grunt_dir}WebIconFonts.eot" "${grunt_dir}WebIconFonts.otf" "${grunt_dir}WebIconFonts.ttf" "${grunt_dir}WebIconFonts.woff" ./css/
grunt w
- grunt をインストールする
- 設定ファイル群を開発フォルダにコピーする
- grunt のプラグイン群をインストールする
- css・src・js フォルダを作成する
- sass などを src フォルダにコピーする
- ウェブフォント群を css フォルダにコピーする
- 初回 grunt
実行してみる
ターミナルで開発フォルダに cd します。その後、以下を実行すればそそくさと環境を整えてくれます。
$ /どこか/grunt/grunt.command
とっても楽になりますね!