pesho hristov
pesho hristov

Reputation: 2060

Grunt.js watch - node_modules always being watched

I'm using Grunt for livereload only. It works fine, but I noticed that it has high CPU, and when I run it with "--verbose" I see that it's watching the whole "node_modules" folder.

So, I made some research, and tried to ignore this. Unfortunately, with no success.

My watch part of "gruntfile.js" is:

    // the watch stuff ..
    watch: {
        all: {
            files: ['!**/node_modules/**', 'js/**/*.js', 'css/**/*.css', 'index.html'],
            options: {
                interval: 5007,
                livereload: true
            }
        }
    },

and basically I'm saying I want grunt to watch all js, css and the index.html file. Explicitly added the code for ignoring "node_modules", but it still says it's watching it and the CPU goes around 30%. (Mac OSx)

==================

One thing I noticed though:

When I make a change in the "gruntfile.js" - for example add one more file to the "files" property of the "watch" task - then it restarts the grunt, and in the console I see it start watching only the files I want, and then CPU goes below 1%. (I guess it's how it should be originally.)

What am I doing wrong?

====================

Edit: Unfortunately, when I change the gruntfile and I see only the files I want are being watched - then the livereload stuff is no longer working.

====================

This is the article I started from: http://thecrumb.com/2014/03/15/using-grunt-for-live-reload/

Here is my package.json file:

{
  "name": "grunt-reload",
  "version": "1.0.0",
  "devDependencies": {
        "grunt": "~0.4.3",
        "matchdep": "~0.3.0",
        "grunt-express": "~1.2.1",
        "grunt-contrib-watch": "~0.6.0",
        "grunt-open": "~0.2.3"
  }
}

And here is my Gruntfile.js:

module.exports = function(grunt) {

    require('matchdep')
        .filterDev('grunt-*')
        .forEach(grunt.loadNpmTasks);

    grunt.initConfig({

        // the web server ..
        express: {
            all: {
                options: {
                    bases: [__dirname],
                    port: 8888,
                    hostname: 'localhost',
                    livereload: true
                }
            }
        },

        // the watch stuff ..
        watch: {
            all: {
                files: ['js/**/*.js', 'css/**/*.css', 'index.html'],
                options: {
                    livereload: true
                }
            }
        },

        // the automatic opening stuff ..
        open: {
            all: {
                path: 'http://localhost:8888/index.html'
            }
        }
    });

    // create the server task ..
    grunt.registerTask(
        'server',
        ['express', 'open', 'watch']
    );

}; // end of "module.exports" ..

And I start all of this with "grunt server".

Upvotes: 1

Views: 866

Answers (1)

Pete TNT
Pete TNT

Reputation: 8403

edit: After you shared your Gruntfile, the problem became more clearer.

In your grunt-express config, you have set livereload to true and bases to __dirname, which is the folder Gruntfile in ran from.

Now, let's look at the grunt-express documentation:

bases

Type: String|Array Default: null

The bases (or root) directories from which static files will be served. A connect.static() will be generated for each entry of bases. When livereload is set to true (or set to a specific port number), a watch task will be created for you (at runtime) to watch your basePath/**/*.*.

(Emphasis mine)

So in your grunt-express config, you set your livereload to watch all the files in your basepath, which of course includes node_modules.

You have couple of options:

  1. Remove your other watch task and config grunt-expresses basepath accordingly (just copy your other config basically).

  2. Keep both of the watch tasks and just ignore the node_modules in the other grunt-express -> bases config.

  3. Remove the bases and handle livereloading in the other watch task


Where is the node_modules folder located? If it's on root, you can just remove the node_modules parameter altogether as long as there aren't any matching glob patterns:

// the watch stuff ..
watch: {
    all: {
        files: ['js/**/*.js', 'css/**/*.css', 'index.html'],
        options: {
            interval: 5007,
            livereload: true
        }
    }
},

Now you are watching: All .js-files under js folder, index.html on root and so on.

However if you have node_modules under js/node_modules, you can the explicitly ignore that folder and the files in it:

 files: ['!js/node_modules/**', 'js/**/*.js', 'css/**/*.css', 'index.html'],

Anyway, depending on your Gruntfiles and node_module-folders location your configuration should work just fine anyway.

Upvotes: 1

Related Questions