gruntjsgruntjsの使い方


備考

このセクションでは、gruntjsの概要と、なぜ開発者がそれを使いたいのかを概説します。

それはまた、gruntjs内の任意の大きな科目に言及し、関連トピックにリンクする必要があります。 gruntjsのドキュメンテーションは新しいので、それらの関連トピックの初期バージョンを作成する必要があるかもしれません。

バージョン

バージョン発売日
0.3.0 2012-07-30
0.4.0 2013-02-17
0.4.1 2013-03-12
0.4.2 2013年11月20日
0.4.3 2014-03-06
0.4.4 2014-03-13
0.4.5 2014-05-11
1.0.0 2016-04-04
1.0.1 2016-04-05

助けて

grunt -hを実行すると、次の情報が表示されます。

  • コマンドラインパラメータ
  • 現在のディレクトリのGruntfileで利用可能なすべてのスタンドアロンタスク
  • 現在のディレクトリのGruntfileにある各タスク群のすべてのサブタスク

グランツのインストール

前提条件

Gruntでは、Node.jsとnpmをインストールする必要があります。ご使用のマシンにNode.jsおよび/またはnpmがインストールされていない場合は、 https://nodejs.orgにアクセスして 、ご使用のオペレーティングシステム用のインストーラまたはパッケージをダウンロードしてください。

最初のインストール

初めてGruntをインストールする場合は、まずGruntコマンドラインインターフェイスパッケージgrunt-cli グローバルにインストールする必要があります。

npm install -g grunt-cli

Gruntのコマンドラインインターフェイスがグローバルにインストールされるので、プロジェクトでGruntのローカルバージョンを実行できます。

次のコマンドを実行して、 grunt-cli パッケージがインストールされていることを確認できます。

grunt --version
 

これは少なくともあなたのgrunt-cli パッケージの現在のバージョンを出力するはずです。

あなたのプロジェクトにGruntをインストールする

grunt-cli を実行した後、実際のgrunt タスクランナーとgrunt-contrib-jshint パッケージgrunt-contrib-jshint をインストールすることができます:

npm install grunt --save-dev
npm install grunt-contrib-jshint --save-dev

これにより、NPMパッケージマネージャからパッケージがダウンロードされ、 devDependencies としてpackage.json ファイルに保存されます。

Gruntfile

次に、Gruntタスクの設定ファイルとして機能するプロジェクトルートにGruntfile.js が必要です。

module.exports = function(grunt) {

    grunt.initConfig({
        jshint: {
            files: ['Gruntfile.js'],
        }
    });

    grunt.loadNpmTasks('grunt-contrib-jshint');


    grunt.registerTask('default', ['jshint']);
};

このファイルは3つのことを行います:

  1. GruntはNPMパッケージからgrunt-contrib-jshint タスクをロードするように指示します
  2. これは、アドバイスjshint ファイルに対して実行するタスクをGruntfile.js
  3. これは、 jshint タスクを実行するdefault というGruntタスクを作成します

ランニンググランツ

プロジェクトを設定したら、Gruntのdefault タスクを以下の呼び出しで実行できます:

grunt

これは、最大発射grunt-cli ローカルで実行さgrunt 兵卒タスクの名前を探しdefault と呼ばれるタスクを実行するように設定されjshint

タスクの実行

構成内のタスク

grunt.initConfig すべての属性は有効なタスクですので、Gruntfileが次のようになっているとします:

module.exports = function(grunt) {

    grunt.initConfig({
        jshint: {
            files: ['Gruntfile.js'],
        }
    });

    grunt.loadNpmTasks('grunt-contrib-jshint');


    grunt.registerTask('default', ['jshint']);
};
 

シェルコマンド$ grunt jshintjshint タスクを実行します。

ターゲットを使用したタスク

タスクは異なるターゲットを持つことができます。このコードスニペットを例にとりましょう:

    grunt.initConfig({
        jshint: {
            gruntfile: {
                files: ['Gruntfile.js']
            },
            project: {
                files: 'src/**/*.js'
            }
        }
    });
 

ここでは、jshintはプロジェクトのgruntfileまたはすべてのJavaScriptファイルを対象とすることができます。 $ grunt jshint を実行すると、両方のターゲットが使用されますが、 $ grunt jshint:gruntfile を実行すると、リンターは$ grunt jshint:gruntfile にのみ適用されます。

登録されたタスク

このgrunt.registerTask('default', ['jshint']); ように登録されたデフォルトのタスクgrunt.registerTask('default', ['jshint']); シェルコマンド$ grunt 実行されます。

新規に登録されたタスクは、コマンドライン引数としてその名前を渡して実行されます。例えば:

grunt.registerTask('gruntfile', ['jshint:gruntfile']);
 

$ grunt gruntfile