Gruntの環境構築

– by

まずNode.jsをダウンロードインストールする

Node.jsの確認

C:\>node -v
v0.10.33

C:\>npm -v
1.4.28

 

次にGruntのインストール

　Gruntのインストールはnpmでインストールする

C:\>npm install -g grunt-cli

Gruntの確認

C:\>grunt -version
grunt-cli v0.1.13

Gruntを使ってみる

ワークスペースへサンプルディレクトリを作成

c:\workspace\>mkdir gruntSampleApp

 

package.jsonはNode.jsが依存ライブラリなどの環境情報を管理するための設定ファイルで次のように「npm init」コマンドを実行する

c:\workspace\gruntSampleApp>npm init

 

gruntモジュールをインストール

c:\workspace\gruntSampleApp>npm install grunt --save-dev
npm WARN package.json [email protected] No description
npm WARN package.json [email protected] No repository field.
npm WARN package.json [email protected] No README data
[email protected] node_modules\grunt
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected]
????? exit@0.1.2
????? [email protected] ([email protected])
????? [email protected] ([email protected], [email protected])
????? glob@3.1.21 ([email protected], [email protected])
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected]
????? [email protected] (glob@3.2.11, [email protected])
????? grunt-legacy-log@0.1.1 ([email protected], [email protected])
?????? [email protected] ([email protected], [email protected])

 

package.jsonを作成

c:\workspace\gruntSampleApp\package.json

{
  "name": "my-project-name",
  "version": "0.1.0",
  "devDependencies": {
    "grunt": "~0.4.0"
  }
}

 

Gruntfile.jsを作成する

c:\workspace\gruntSampleApp\Gruntfile.js

module.exports = function (grunt) {

  grunt.registerTask('hello', 'description here', function() {
    grunt.log.writeln('hello! hello!');
  });

  grunt.registerTask('default', [ 'hello' ]);

};

 

gruntを実行してみる

c:\workspace\gruntSampleApp>grunt
Running "hello" task
hello! hello!

 

参考サイト

https://app.codegrid.net/entry/grunt-introduction

http://www.atmarkit.co.jp/ait/articles/1403/04/news020_2.html