Gruntの使い方:CompassでCSSスプライトを自動生成する 実はGruntは関係なくてCompass単体の機能なのですが、前々回GruntでCompassを自動処理できるようにしたので、scssファイルに記述を追加するだけでCSSスプライトを自動生成できます。 下記のフォルダ構成… ゴトーハック2013.12.19 343
Gruntの使い方:プラグインを削除する 不要だと思ったプラグインは下記コマンドで削除。 npm remove {プラグイン名} –save-dev 例) npm remove grunt-contrib-less –save-dev 「–sav… ゴトーハック2013.12.18 590
Gruntの使い方:Compassをコンパイルする 前回Sassのコンパイルを行いましたが、Compassのコンパイルはまた別のタスクになります。 下記のフォルダ構成を前提とします。 project ├css ├sass ├config.rb (compass用設定ファイ… ゴトーハック2013.12.18 249
Gruntの使い方:Sassをコンパイルする 下記のフォルダ構成を前提とします。 project ├css ├sass ├package.json └Gruntfile.js Gruntプラグインは grunt-contrib をインストールしてあることを前提としま… ゴトーハック2013.12.16 853
Gruntの使い方:プラグインを一括で読み込む 前回の続きです。プロジェクトフォルダは前回同様となります。 プラグインを多数インストールしている場合、一つ一つGruntfile.jsに設定しなければならないのは手間です。 Gruntfile.js を下記のように修正し… ゴトーハック2013.12.13 252
Gruntの使い方:タスクをまとめて実行 前回の続きです。コマンドプロンプトを package.json のあるプロジェクトフォルダへ移動しておいてください。 module.exports = function(grunt) { grunt.initConfig… ゴトーハック2013.12.12 622
Gruntの使い方:ファイルを監視しタスクを自動実行する 前回の続きです。コマンドプロンプトを package.json のあるプロジェクトフォルダへ移動しておいてください。 Gruntfile.js を開いて grunt.initConfig に「grunt-contrib-… ゴトーハック2013.12.11 694
Gruntの使い方:タスクを実行させる 前回の続きです。コマンドプロンプトを package.json のあるプロジェクトフォルダへ移動しておいてください。 まずプロジェクトフォルダ内が下記の構成になるようCSS用フォルダとファイルを用意してください。 pro… ゴトーハック2013.12.10 265
Gruntの使い方:プラグインのインストール 前回の続きです。コマンドプロンプトを package.json のあるプロジェクトフォルダへ移動しておいてください。 今回はGruntに機能を加えるプラグインを入れます。 npm install grunt-contri… ゴトーハック2013.12.09 311