Grunt: Watch multiple files, Compile only Changed

Question

I\'m new to Grunt, and so far I\'m enjoying it very much. I want Grunt to compile only the changed files when running grunt watch

In my Grunfile.coffee

Answer 1

If you concat all .coffee sources into one .js file, then you will have to recompile it every time if any of your sources changes. Split it up to several .js files and make a release task where you only concat these .js files. This way you still only need to include one .js file.

See Using gruntjs, how do watch for changes in .coffee files?

Answer 2

The grunt.event.on event detects changes in files, receiving an action and filepath parameter.

Here's an untested example based on one of my gruntfiles. In this case, all my source coffeescript files are kept in a directory called sources, and for previewing they are compiled and saved to an identical directory structure under a directory called 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"
)

Hope that helps.

EDIT: Probably not exactly what you want - because no doubt you want access to intermediary variables, actions and so forth - but you could use grunt to just run a shell coffee command. The grunt-shell npm task does this, for example

EDIT2: I've faced continued problems with grunt.watch.on not working consistently in grunt 0.4.1 on OSX 10.8 and MacVim 7.3; for whatever reason, it stops watching. I've reverted back to just using the basic grunt initConfig object but with much more granularity so it only watches and compiles relatively small groups of files rather than the whole lot. This slows down the build time considerably, but it much more robust. Your mileage may very.

Answer 3

I've stumbled upon this, too and did not find any working versions that worked with the current version (0.4.1) But Jof Arnolds answer showed a good approach.

This is what I came up with:

# 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

I have a coffee section that looks somewhat like this:

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"
    ]

Answer 4

I've finally found a real solution! And it's super simple too!

npm install grunt-newer --save-dev

Then in your Gruntfile (after loading the task in grunt):

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

And that's it! The Awesome grunt-newer is awesome!