web-dev-qa-db-ja.com

Grunt：複数のファイルを監視、コンパイルのみ変更

私はGruntが初めてで、これまでのところとても楽しんでいます。 Gruntはgrunt watchの実行時に変更されたファイルのみをコンパイルしたい

私のGrunfile.coffeeには現在（関連部分）があります。
注：asset/javascript/app.coffeeおよびasset/javascript/app.jsはディレクトリです

    coffee:
        default:
            expand: true
            cwd: "assets/javascript/app.coffee"
            src: ["*.coffee"]
            dest: "assets/javascript/app.js"
            ext: ".js"

    uglify:
        dev:
            options:
                beautify: true
                compress: false
                mangle: false
                preserveComments: 'all'

            files: 
                "js/app.js": "assets/javascript/app.js/*.js"
                "js/libs.js": "assets/javascript/libs/*.js"

    watch:
        coffeescript:
            files: 'assets/javascript/**/*.coffee'
            tasks: ["coffee"]

        javascript:
            files: "assets/**/*.js"
            tasks: ["uglify:dev"]
        livereload:
            files: ["Gruntfile.coffee", "js/*.js", "*.php", "css/*.css", "images/**/*.{png,jpg,jpeg,gif,webp,svg}", "js/*.js", ]
            options:
                livereload: true

おそらくもっと短い方法がありますが、最初にapp.coffeeをapp.jsにコンパイルするので、作業を配布した後、Coffeescriptに不慣れな人でもある程度合理的な方法でコードを閲覧できます。

これらすべての問題は、Coffeescriptファイルを保存したため、手順が多すぎることです（思う）。

>> File "assets/javascript/app.coffee/browse.coffee" changed.

Running "coffee:default" (coffee) task
File assets/javascript/app.js/browse.js created.
File assets/javascript/app.js/filters.js created.

Done, without errors.
Completed in 0.837s at Tue May 28 2013 12:30:18 GMT+0300 (EEST) - Waiting...
OK
>> File "assets/javascript/app.js/browse.js" changed.
>> File "assets/javascript/app.js/filters.js" changed.

Running "uglify:dev" (uglify) task
File "js/app.js" created.
File "js/libs.js" created.

Done, without errors.
Completed in 0.831s at Tue May 28 2013 12:30:19 GMT+0300 (EEST) - Waiting...
OK
>> File "js/app.js" changed.
>> File "js/libs.js" changed.

Completed in 0.000s at Tue May 28 2013 12:30:19 GMT+0300 (EEST) - Waiting...

現在、私は自分のプロジェクトを設定しているだけですが、Coffeescriptファイルがさらに多くなり、ファイルが変更されるたびにCoffeescriptにすべてのファイルを再コンパイルさせたくありません。

さらに、libs.jsはこのすべてに関与していませんが、「assets/* /。js」パターンとも一致するため、コンパイルされたままであると思います。

Gruntに変更されたファイルのみをコンパイルさせる方法はありますか？

node.jscoffeescriptgruntjs
42
justnorris

私はついに本当の解決策を見つけました！そしてそれも非常に簡単です！

npm install grunt-newer --save-dev

次に、Gruntfileで（gruntにタスクをロードした後）：

watch:
    coffeescript:
        files: 'assets/javascript/**/*.coffee'
        tasks: ["newer:coffee"]

以上です！ 素晴らしいgrunt-newerは素晴らしい！

75
justnorris

すべての.coffeeソースを1つの.jsファイルに連結する場合、ソースのいずれかが変更された場合は、毎回それを再コンパイルする必要があります。それをいくつかの.jsファイルに分割し、これらの.jsファイルのみを連結するreleaseタスクを作成します。この方法では、1つの.jsファイルのみを含める必要があります。

gruntjsを使用して、.coffeeファイルの変更をどのように監視しますか？ を参照してください。

2
Jamesgt

grunt.event.onイベントはファイルの変更を検出し、actionおよびfilepathパラメーターを受け取ります。

これは、私のgruntfilesの1つに基づいた未テストの例です。この場合、すべてのソースcoffeescriptファイルはsourcesと呼ばれるディレクトリに保持され、プレビューのためにそれらはコンパイルされ、devと呼ばれるディレクトリの下の同一のディレクトリ構造に保存されます

SOURCES_DIR = 'sources'
DEV_DIR = 'dev'

grunt.initConfig
  watch :
    all :
      files : ["**/*.coffee"]
  coffee :
    dev :
      files :
        dest : "app.js"
grunt.loadNpmTasks 'grunt-contrib-watch'
grunt.loadNpmTasks 'grunt-contrib-coffee'

grunt.registerTask 'build', ['coffee:dev']

grunt.event.on('watch', (action,filepath) ->
  # Determine the full directory of the changed file
  wdi = filepath.lastIndexOf '/'
  wd =  filepath.substring 0,wdi

  # remove `sources` prefix from that directory
  fpath = wd.replace(SOURCES_DIR,'') + '/'

  # determine the filename
  fnamei = filepath.lastIndexOf '.'
  fname = filepath.substring wdi+1,fnamei # NOTE: this breaks the case where in same dir

  # concatenate fpath and fname with the dir to be compiled into
  deststr = "#{DEV_DIR}#{fpath}#{fname}.coffee"


  # set coffee.dev.files value in the coffee task to have am entry of form {"destination":"source"}
  obj = {}
  obj[deststr] = filepath
  grunt.config "coffee.dev.files", obj

  # fire the coffee task
  grunt.task.run "coffee"
)

お役に立てば幸いです。

編集：たぶんあなたが望むものとは正確に違います-間違いなく中間変数やアクションなどにアクセスしたいからです-しかしgruntを使ってShell coffeeコマンドを実行することができます。 grunt-Shell npmタスクはこれを行います、例えば

EDIT2：grunt.watch.on OSX 10.8およびMacVim 7.3のgrunt 0.4.1で一貫して動作しません。何らかの理由で、視聴を停止します。基本的なgrunt initConfigオブジェクトを使用するだけに戻りましたが、粒度がはるかに大きいため、全体ではなく比較的小さなファイルグループのみを監視およびコンパイルします。これにより、ビルド時間が大幅に遅くなりますが、はるかに堅牢です。あなたの走行距離は非常に大きいかもしれません。

1
Jof Arnold

私もこれに出くわし、現在のバージョン（0.4.1）で動作する動作中のバージョンは見つかりませんでしたが、Jof Arnoldsの回答は良いアプローチを示しました。

これは私が思いついたものです：

# only recompile changed files
grunt.event.on "watch", (action, filepath) ->
  # note that we have to manually change the target file name to 
  # our desired format
  targetName = filepath.replace(/\/(client|shared)/, "")
    .replace(".coffee", ".js")
    .replace("app/", "")

  options =
    src: filepath
    dest: "public/javascripts/#{targetName}"

  grunt.config ["coffee", "client"], options

次のようなコーヒーセクションがあります。

coffee:
  client:
    options:
      sourceMap: false
    files: [
      expand: true
      cwd: "app"
      src: ["*/client/**/*.coffee", "helpers/{client,shared}/*.coffee"]
      dest: "public/javascripts"
      rename: (folder, name) ->
        name = name.replace(/\/(client|shared)/, "")

        [folder, name].join path.sep
      ext: ".js"
    ]
0
Sebastian Hoitz