Gruntfile.js and corresponding package.json for setting up a browerify react dev environment through babel

Gruntfile.js

// This was set up using the help of this tut:
//http://merrickchristensen.com/articles/gruntjs-workflow.html
module.exports = function(grunt) {
  require('load-grunt-tasks')(grunt);

  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    autoprefixer: {
      app: {
        options: {
          browsers: ['last 2 versions', 'ie 8', 'ie 9'],
          cascade: true,
          safe: false,//safe, while well-intentioned, is…just not a good idea
        },
        src: 'assets/out/css/app.css',
        dest: 'assets/out/css/app.css',
      },
    },

    sass: {
      app_dev: {
        files:{
          'assets/out/css/app.css' : 'assets/in/sass/index.scss'
        }
      },

      app_prod: {
        options:{
          style: 'compressed'
        },
        files: {
          'assets/out/css/app.css' : 'assets/in/sass/index.scss'
        }
      }
    },

    //watch for stuff when we save
    watch: {
      app_js: {
        // files: ['assets/in/js/**/*', 'web_modules/**/*'],
        // tasks: ['browserify']
      },

      app_css: {
        files: ['assets/in/sass/**/*.scss', 'assets/in/sass/*.scss'],
        tasks: ['sass:app_dev', 'autoprefixer:app']
      },
      app_svg: {
        files: ['assets/in/svg/*.svg'],
        tasks: ['svgstore'],
      },
    },

    svgstore: {
      options: {
        prefix : '_icon-',
        svg: {
          display: 'none',
          xmlns: 'http://www.w3.org/2000/svg',
        },
        includedemo: true,
      },
      default : {
        files: {
          'assets/out/svg/sprite.svg' : ['assets/in/svg/*.svg'],
        }
      }
    },
    browserify: {
      'dev' : {
        'options' :{
          'debug': true,
          'transform': [['babelify', {presets: ['es2015', 'react']}]]
        },
        'files': {
          'assets/out/js/app.js': ['assets/in/js/index.jsx']
        },
      },
      'dev_watch': {
        'options' :{
          'debug': true,
          'watch' : true,
          'keepAlive' : true,
          'transform': [['babelify', {presets: ['es2015', 'react']}]]
        },
        'files': {
          'assets/out/js/app.js': ['assets/in/js/index.jsx']
        },
      },
      'prod' : {
        'options' :{
          'debug': false,
          'transform': [['babelify', {presets: ['es2015', 'react']}]]
        },
        'files': {
          'assets/out/js/app.js': ['assets/in/js/index.jsx']
        },
      },
    },

    'concurrent': {
      'watch' : {
        'tasks': ['browserify:dev_watch', 'watch:app_css', 'watch:app_svg'],
        'options': {
          'logConcurrentOutput': true
        }
      },
      'prod' : ['browserify:prod', ['sass:app_prod', 'autoprefixer:app'], 'svgstore'],
    }
  });//initConfig

  //-----------------------------------------------------------------------------
  //CUSTOM CLI COMMANDS
  // All tasks we have going in the initconfig should be registered here. Else
  //   the cli won't know what we're asking
  grunt.registerTask('default', 'Compiles sass, concats js, builds SVG sprite.', function(n) {
    var tasklist = ['browserify:dev', 'sass:app_dev', 'autoprefixer:app', 'svgstore'];

    //watch should always be last
    if(grunt.option('watch')) {
      tasklist.push('concurrent:watch')
    }

    grunt.task.run(tasklist);
  });

  grunt.registerTask('js', 'Concats javascript files,  pass --watch to concat as you go', function(n){
    var tasklist = ['browserify:dev'];

    //watch should always be last
    if(grunt.option('watch')) {
      tasklist[0] = 'browserify:dev_watch';
    }

    grunt.task.run(tasklist);
  });


  grunt.registerTask('css', 'Compiles sass to css. Pass --watch to compile as you go. Pass --ie to build the IE-specific styles', function(n){
    var tasklist = ['sass:app_dev', 'autoprefixer:app'];

    //Watch should always be last
    if(grunt.option('watch')) {
      tasklist.push('watch:app_css');
    }

    grunt.task.run(tasklist);
  });

  grunt.registerTask('svg', 'Combines svg files into a new SVG sprite, pass --watch to combine as you go', function(n){
    var tasklist = ['svgstore'];

    //Watch should always be last
    if(grunt.option('watch')) {
      tasklist.push('watch:app_svg');
    }

    grunt.task.run(tasklist);
  });

  grunt.registerTask('prod', 'Compiles sass to compressed css, uglifies javascript, creates SVG sprite', function(n){
    //runs things at the same time, way faster
    var tasklist = ['concurrent:prod'];
    grunt.task.run(tasklist);
  });
};

package.json

{
  "name": "Gaggle",
  "version": "1.0.0",
  "description": "u wot m8",
  "main": "index.js",
  "repository": "https://github.com/joshdcomp/gaggle",
  "dependencies": {
    "6to5ify": "^3.1.0",
    "babel-preset-es2015": "^6.6.0",
    "babel-preset-react": "^6.5.0",
    "babelify": "^7.2.0",
    "browserify": "^8.0.3",
    "event-emitter": "*",
    "fluxify": "*",
    "grunt": "^0.4.5",
    "grunt-autoprefixer": "*",
    "grunt-contrib-sass": "*",
    "grunt-contrib-watch": "*",
    "grunt-svgstore": "^1.0.0",
    "install": "^0.5.4",
    "load-grunt-tasks": "^3.4.0",
    "npm": "^3.7.5",
    "react": "^0.14.7",
    "react-dom": "*",
    "react-router": "^2.0.0",
    "watchify": "^2.2.1"
  },
  "devDependencies": {
    "grunt-browserify": "^4.0.1",
    "grunt-concurrent": "^2.2.1",
    "load-grunt-tasks": "^3.4.1"
  },
  "scripts": {
    "watch": "watchify -t 6to5ify ./assets/in/js/index.jsx -o ./assets/out/js/app.js -v"
  },
  "author": "",
  "license": "ISC"
}