Search code examples
javascriptreactjsbrowserifygrunt-browserify

Grunt-Browserify Ignore Option


I have a React app that I am transforming, uglifying and browserfying via Grunt. My grunt file looks like this...

module.exports = function(grunt) {
grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    browserify: {
        dist: {
            files: {
                './Scripts/build/App.js': ['./Scripts/src/**/*.js']
            },
            options: {
                browserifyOptions: {
                    debug: true
                },
                transform: [ require('grunt-react').browserify ],
                ignore: './Scripts/src/**/*-test.js'
            }
        }
    },
    uglify: {
        my_target: {
            files: {
                './Scripts/build/App-min.js': ['./Scripts/build/App.js']
            }
        }
    },
    watch: {
        scripts: {
            files: ['./Scripts/src/**/*.js'],
            tasks: ['browserify', 'uglify'],
            options: {
                spawn: false
            },
        },
    },

})

grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-browserify');
grunt.loadNpmTasks('grunt-contrib-watch');
}

You will notice the ignore property of the browserify task is telling it to ignore any file with -test.js in the filename, the reason being that my tests are stored in folders directly next to the file I am testing (as seems to be the convention when looking at the React Flux examples) and I don't want the test files being bundled in to my app.js file. Can anyone tell me if I am doing this wrong because so far it doesnt seem to be working at all? The test files get bundled into app.js and then I get console errors about jest not being defined.


Solution

  • Did a bit of lateral Googling and found a post on stack Here

    It seems that you can add files to the src array and if you prefix them with a '!' it marks them as ignored files.

    My now working grunt file....

    module.exports = function(grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        browserify: {
            dist: {
                files: {
                    './Scripts/build/App.js': ['./Scripts/src/**/*.js', '!./Scripts/src/**/*-test.js']
                },
                options: {
                    browserifyOptions: {
                        debug: true
                    },
                    transform: [ require('grunt-react').browserify ]
                }
            }
        },
        uglify: {
            my_target: {
                files: {
                    './Scripts/build/App-min.js': ['./Scripts/build/App.js']
                }
            }
        },
        jest: {
            options: {
                coverage: true,
                testPathPattern: /.*-test.js/
            }
        },
        watch: {
            scripts: {
                files: ['./Scripts/src/**/*.js'],
                tasks: ['browserify', 'uglify'],
                options: {
                    spawn: false
                },
            },
        },
    
    })
    
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-jest');
    grunt.loadNpmTasks('grunt-browserify');
    grunt.loadNpmTasks('grunt-contrib-watch');
    }