grunt-contrib-copy syntax for process option confusion

Question

I'm trying to replace some placeholders in different files as I copy. My gruntfile works fine, but adding in the process option to do the replacements, it's just not working. Below is the relevant section of my gruntfile:

grunt.initConfig({

    copy: {
        js: {
            files: [{
                expand: true,
                cwd: 'src/wp-content/themes/pilau-starter/',
                src: ['**/*.js'],
                dest: 'public/wp-content/themes/pilau-starter/'
            }],
            options: {
                process: function ( content ) {
                    console.log( content );
                    content = content.replace( /pilauBreakpointLarge/g, breakpoints.large );
                    content = content.replace( /pilauBreakpointMedium/g, breakpoints.medium );
                    return content;
                }
            }
        },
    }

});

The paths can be understood in the context of the code on GitHub: https://github.com/pilau/starter (the public directory isn't committed to the repo because it's a starter theme). Those paths are variables in my original Gruntfile, and are working fine in all other tasks.

All the vars are set up OK. I've included the console.log( content ) to check if the process function's actually running - it doesn't seem to be, so I guess it's basic syntax.

There's an answer (https://stackoverflow.com/a/28600474/1087660) which seems to address this, but as far as I can tell, that way of doing it is simply bad JS syntax - not sure how it got marked as right.

--verbose output for running the copy task:

Running "copy:js" (copy) task
Verifying property copy.js exists in config...OK
Files: src/wp-content/themes/pilau-starter/js/admin.js -> public/wp-content/themes/pilau-starter/js/admin.js
Files: src/wp-content/themes/pilau-starter/js/flickity.js -> public/wp-content/themes/pilau-starter/js/flickity.js
Files: src/wp-content/themes/pilau-starter/js/global.js -> public/wp-content/themes/pilau-starter/js/global.js
Files: src/wp-content/themes/pilau-starter/js/modernizr.js -> public/wp-content/themes/pilau-starter/js/modernizr.js
Files: src/wp-content/themes/pilau-starter/js/picturefill.js -> public/wp-content/themes/pilau-starter/js/picturefill.js
Files: src/wp-content/themes/pilau-starter/js/respond.js -> public/wp-content/themes/pilau-starter/js/respond.js
Options: processContent=false, processContentExclude=[], process=undefined
Options: processContent=false, processContentExclude=[], process=undefined
Copying src/wp-content/themes/pilau-starter/js/admin.js -> public/wp-content/themes/pilau-starter/js/admin.js
Reading src/wp-content/themes/pilau-starter/js/admin.js...OK
Writing public/wp-content/themes/pilau-starter/js/admin.js...OK

Answer 1

Your version of grunt-contrib-copy is 0.4.0. As correctly point out by @nemesv above the property name to use in this version would be processContent not process.

I cloned your repo and switched to json-breakpoints branch. And ran grunt copy:js and it replaced the content.

Now,when you run grunt copy:js --verbose it will still show this

processContent is logged undefined because grunt uses JSON.stringify to log a value. And JSON.stringify returns undefined when you pass it a function definition.

---

If you are interested, here's the method reponsible for logging all the option

    Log.prototype.writeflags = function(obj, prefix) {
        var wordlist;
        if (Array.isArray(obj)) {
            wordlist = this.wordlist(obj);
        } else if (typeof obj === 'object' && obj) {
            wordlist = this.wordlist(Object.keys(obj).map(function(key) {
                var val = obj[key];
                return key + (val === true ? '' : '=' + JSON.stringify(val));
            }));
        }
        this._writeln((prefix || 'Flags') + ': ' + (wordlist || '(none)'.cyan));
        return this;
    };