Gruntターゲット間でファイルを共有する方法は？

Question

私のGruntfileは、同じタスクの2つのターゲットdistとdevの間で共有されている"files"をすべて繰り返しています。ここだけスタイラスの問題を含むサンプルです：

"use strict"; 

module.exports = function (grunt) { 
    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    grunt.initConfig({ 
     stylus: { 
      dist: { 
       files: { "www/bundle.css": ["stylus/*.styl"] }, 
       options: { compress: true, linenos: false } 
      }, 
      dev: { 
       files: { "www/bundle.css": ["stylus/*.styl"] }, 
       options: { compress: false, linenos: true } 
      } 
     } 
    }); 

    grunt.registerTask("dev", ["stylus:dev"]); 
    grunt.registerTask("prod", ["stylus:prod"]); 
}; 

ので、私は両方のターゲットでそれを繰り返す必要はありませんレベルをアップ設定ファイルを移動する方法はありますか？

Answer 1

Domenic、あなたはPOJS変数を使用できます：

"use strict"; 

module.exports = function (grunt) { 
    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    var stylusFiles = { "www/bundle.css": ["stylus/*.styl"] }; 

    grunt.initConfig({ 
     stylus: { 
      dist: { 
       files: stylusFiles, 
       options: { compress: true, linenos: false } 
      }, 
      dev: { 
       files: stylusFiles, 
       options: { compress: false, linenos: true } 
      } 
     } 
    }); 

    grunt.registerTask("dev", ["stylus:dev"]); 
    grunt.registerTask("prod", ["stylus:prod"]); 
}; 

それとも、Grunt "Configuring Tasks" Guideごとにテンプレートを使用することができます。

"use strict"; 

module.exports = function (grunt) { 
    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    grunt.initConfig({ 
     stylus: { 
      dist: { 
       files: { "www/bundle.css": ["stylus/*.styl"] }, 
       options: { compress: true, linenos: false } 
      }, 
      dev: { 
       files: "<%= stylus.dist.files %>", 
       options: { compress: false, linenos: true } 
      } 
     } 
    }); 

    grunt.registerTask("dev", ["stylus:dev"]); 
    grunt.registerTask("prod", ["stylus:prod"]); 
}; 

Answer 2

私は下のコードをテストしていませんが、私は思っているはずです。私はちょうど前にキーの設定を使用していない、値のみ。うまくいけば少なくともそれはスタートだ。

"use strict"; 

module.exports = function (grunt) { 
    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    var buildConfig = { 
    output: "www/bundle.css", 
    files: ["stylus/*.styl"], 
    }; 

    grunt.initConfig({ 
    config: buildConfig, 
    stylus: { 
     dist: { 
      files: {<%= config.output%>: <%= config.files %>}, 
      options: { compress: true, linenos: false } 
     }, 
     dev: { 
      files: {<%= config.output%>: <%= config.files %>}, 
      options: { compress: false, linenos: true } 
     } 
    } 
    }); 

    grunt.registerTask("dev", ["stylus:dev"]); 
    grunt.registerTask("prod", ["stylus:prod"]); 
}; 

Answer 3

あなたは自分のうなり声の設定で行項目として追加することができます：あなたはより多くの例が必要な場合

"use strict"; 

module.exports = function (grunt) { 
    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    grunt.initConfig({ 
     cssFiles: ["stylus/*.styl"], 
     stylus: { 
      dist: { 
       files: { "www/bundle.css": '<%= cssFiles %>' }, 
       options: { compress: true, linenos: false } 
      }, 
      dev: { 
       files: { "www/bundle.css": '<%= cssFiles %>' }, 
       options: { compress: false, linenos: true } 
      } 
     } 
    }); 

    grunt.registerTask("dev", ["stylus:dev"]); 
    grunt.registerTask("prod", ["stylus:prod"]); 
}; 

は私のプロジェクトの一つに私が使用しているファイルを見てください： https://github.com/sugendran/cheatsheet.js/blob/master/Gruntfile.js

Answer 4

チェックアウトテンプレート：http://gruntjs.com/configuring-tasks#templates

"use strict"; 

module.exports = function (grunt) { 
    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    grunt.initConfig({ 
    stylus: { 
     dist: { 
     files: { 
      "www/bundle.css": ["stylus/*.styl"], 
     }, 
     options: { compress: true, linenos: false } 
     }, 
     dev: { 
     files: "<%= stylus.dist.files %>", 
     options: { compress: false, linenos: true } 
     } 
    } 
    }); 

    grunt.registerTask("dev", ["stylus:dev"]); 
    grunt.registerTask("prod", ["stylus:prod"]); 
}; 

Answer 5

私はこれまでにいくつかの異なる方法にアプローチしてきました。 1つは、環境変数を利用し、環境変数を使用してスタイラス1のような単純なフラグを切り替えることです。このアプローチを拡張すると、フラグを設定するタスクを登録することさえできます。例えば。

"use strict"; 

var env = 'DEV'; 

module.exports = function (grunt) { 
    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    grunt.initConfig({ 
     stylus: { 
      dist: { 
       files: { "www/bundle.css": ["stylus/*.styl"] }, 
       options: { compress: env === 'PROD', linenos: env === 'DEV' } 
      } 
     } 
    }); 

    grunt.registerTask('production', function() { 
     env = 'PROD'; 
    }); 

    grunt.registerTask("dev", ["stylus"]); 
    grunt.registerTask("prod", ["production", "dev"]); 
}; 

テンプレートのルートに移動することも、ベースオブジェクトを拡張することもできますが、通常、フラグは使用するのに十分単純です。あなたも直接grunt.config.dataを編集して）initConfig（再呼び出しせずに設定を変更することができますように見える

Answer 6

このような何かが働くかなり確信して...

"use strict"; 

module.exports = function (grunt) { 

    grunt.loadNpmTasks("grunt-contrib-stylus"); 

    var files = { "www/bundle.css": ["stylus/*.styl"] }; 
    var options; 

    grunt.registerTask("config", function() { 
     grunt.initConfig({ 
      stylus: { 
       main: { 
        files: files, 
        options: options 
       } 
      } 
     }); 
    }); 

    grunt.registerTask("setup-prod", function() { 
     options = { compress: false, linenos: true }; 
    }); 

    grunt.registerTask("setup-dev", function() { 
     options: { compress: true, linenos: false }; 
    }); 

    grunt.registerTask("dev", ["setup-dev", "config", "stylus"]); 
    grunt.registerTask("prod", ["setup-prod", "config", "stylus"]); 
}; 

。