christophe
christophe

Reputation: 692

Grunt watch doesn't work during grunt server task

I am using Grunt with a grunt server task that performs a watch task. Unfortunately, after saving a less or coffee file, the "default" task that should be triggered by the watch taks doesn't get triggered and so the browser doesn't livereload.

I was searching the problem but didn't find a proper solution.

Here is an extract of my Gruntfile.coffee:

grunt.registerTask "server", [
    'less'
    'coffee'
    'copy'
    "concurrent:server"
    "connect:livereload"
    "open"
    "watch"
]

grunt.registerTask "default", [
    'less'
    'coffee'
    'copy'
]

watch:
    coffee:
        files: [
            '<%= assets %>/scripts/{,*/}*.coffee'
            'Gruntfile.coffee'
            '<%= assets %>/scripts/*.coffee'
        ]

    less:
        files: [
            '<%= assets %>/styles/**/**/*.less'
            '<%= assets %>/styles/**/*.less'
            '<%= assets %>/styles/*.less'
            ]

    files: [
        'app/**/*.php'
        'app/**/*.html'
    ]

    tasks: 'default'

    livereload:
        options:
            livereload: LIVERELOAD_PORT # is 37562

        files: [
            "<%= assets %>/{,*/}*.html"
            '<%= assets %>/styles/**/*.less'
            '<%= assets %>/scripts/*.coffee'
            '<%= assets %>/styles/**/*.less'
            '<%= assets %>/styles/*.less'
        ]

Thank you for your help in advance! :)

Upvotes: 0

Views: 1038

Answers (2)

Kyle Robinson Young
Kyle Robinson Young

Reputation: 13762

You're watch task is incorrectly configured. It takes blocks of files to watch and tasks to run. Both your coffee and less targets are configured to watch files but not run tasks. Then you have a block that is not within any target.

Take a closer look at the examples on the watch task: https://github.com/gruntjs/grunt-contrib-watch#examples

Here is a (semi) fixed config:

watch:
  coffee:
    files: [
      '<%= assets %>/scripts/{,*/}*.coffee'
      'Gruntfile.coffee'
      '<%= assets %>/scripts/*.coffee'
    ]
    tasks: ['coffee']

  less:
    files: [
      '<%= assets %>/styles/**/**/*.less'
      '<%= assets %>/styles/**/*.less'
      '<%= assets %>/styles/*.less'
    ]
    tasks: ['less']

   TARGETNAMENEEDEDHERE:
     files: [
       'app/**/*.php'
       'app/**/*.html'
     ]
     tasks: 'default'

   ###
   The files in this target are not configured correctly.
   Typically people create a livereload target to watch destination files.
   So the livereload will only trigger when one of the above targets writes
   to a destination file. But you're watching source files below.
   ###
   livereload:
      options:
        livereload: LIVERELOAD_PORT # is 37562
      files: [
        "<%= assets %>/{,*/}*.html"
        '<%= assets %>/styles/**/*.less'
        '<%= assets %>/scripts/*.coffee'
        '<%= assets %>/styles/**/*.less'
        '<%= assets %>/styles/*.less'
      ]

Upvotes: 2

Feech
Feech

Reputation: 4102

Why not define separate tasks for each of your watched file groups?

watch:
  coffee:
    files: [
      'Gruntfile.coffee'
      '<%= assets %>/scripts/*.coffee'
    ]
    tasks: 'coffee'

  less:
    files: [
      '<%= assets %>/styles/**/**/*.less'
      '<%= assets %>/styles/**/*.less'
      '<%= assets %>/styles/*.less'
    ]
    tasks: 'less

This will compile your CoffeeScript when a .coffee file is saved, and compile your less when a .less file is saved. It doesn't make sense to recompile all your less files when a coffee file is changed, and vice versa.

Upvotes: 2

Related Questions