gulpfile.js

var path = require('path'),
    gulp = require("gulp"),
    gutil = require("gulp-util"),
    gfilter = require('gulp-filter'),
    mocha = require('gulp-mocha'),
    awspublish = require('gulp-awspublish');

var webpack = require("webpack"),
    webpackGB = require('gulp-webpack-build'),
    WebpackDevServer = require("webpack-dev-server");

var paths = {
  src: './src',
  public: './public',
  config: {
      dev: './config/dev.webpack.config.js',
      prod: './config/prod.webpack.config.js',
  }
};

//
// Idiomatic gulp+webpack
//
gulp.task('webpack', [], function() {
  return gulp.src(paths.config.prod, { base: path.resolve(paths.src) })
    .pipe(webpackGB.compile({}))
    .pipe(webpackGB.format({
      version: true,
      timings: true
    }))
    .pipe(webpackGB.failAfter({
      errors: true,
      warnings: true
    }))
    .pipe(gulp.dest(paths.public));
});

//
// Run development server
//
gulp.task("server", function(callback) {
  // Prepare config
  var config = require(paths.config.dev);
  var compiler = webpack(config);

  // Start a webpack-dev-server
  var server = new WebpackDevServer(compiler, {
    publicPath: config.output.publicPath,
    hot: true,
    historyApiFallback: true,
    stats: {
      colors: true,
      chunks: false
    }
  })

  // without this server tries to serve react routes from filesystem
  server.use('/', function(req, res) {
    res.sendFile(path.join(__dirname+'/index.html'));
  })

  server.listen(3000, "localhost", function(err) {
    // stop if there was an error
    if(err) throw new gutil.PluginError("webpack-dev-server", err);

    // Server listening
    gutil.log("[webpack-dev-server]", "http://localhost:3000/");

    // keep the server alive or continue?
    // callback();
  });

});

//
// Upload content from /public to S3 bucket
// Credentials are automatically picked from environment variables:
// - AWS_ACCESS_KEY_ID
// - AWS_SECRET_ACCESS_KEY
//
gulp.task("s3upload", ["webpack"], function(callbacl) {

  // create a new publisher
  var publisher = awspublish.create({
    bucket: 'assets.app4brand.com'
  });

  // define custom headers
  var headers = {
    'Cache-Control': 'max-age=315360000, no-transform, public'
  }

  // filter for js assets
  var jsFilter = gfilter(['*.js']);

  // upload compressed js
  return gulp.src('./public/**')
    // for *.js - gzip and Set Content-Encoding headers
    .pipe(jsFilter)
    .pipe(awspublish.gzip())
    .pipe(jsFilter.restore())
    // publisher will add Content-Length, Content-Type and headers specified above
    // If not specified it will set x-amz-acl to public-read by default
    .pipe(publisher.publish(headers))
    // remove old files
    .pipe(publisher.sync())
    // print upload updates to console
    .pipe(awspublish.reporter());
});

//
// Making CircleCI happy while we have no Karma
//
gulp.task("test", function(callback) {

  return gulp.src('test/test.js', {read: false})
        .pipe(mocha({reporter: 'spec'}));

});

prod.webpack.config.js

var webpack = require('webpack');
var common = require('./webpack.common');
var extend = require('underscore').extend;

module.exports = extend(common, {
  devtool: '#source-map',
  entry: [
    './src/index'
  ],
  output: {
    path: __dirname + '/../public/',
    filename: 'bundle.js',
    publicPath: 'http://assets.app4brand.com/'
  },
  plugins: [
    new webpack.DefinePlugin({
      'process.env': {
        'NODE_ENV': JSON.stringify('production')
      }
    }),
    new webpack.optimize.OccurenceOrderPlugin(),
    new webpack.optimize.UglifyJsPlugin({
      compressor: {
        warnings: false
      }
    })
  ]
});

webpack.common.js

var webpack = require('webpack');

module.exports = {
  module: {
    loaders: [
      // Needed for the css-loader when [bootstrap-webpack](https://github.com/bline/bootstrap-webpack)
      // loads bootstrap's css.
      { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/,   loader: "url?limit=10000&minetype=application/font-woff" },
      { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/,   loader: "url?limit=10000&minetype=application/font-woff" },
      { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/,    loader: "url?limit=10000&minetype=application/octet-stream" },
      { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/,    loader: "file" },
      { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/,    loader: "url?limit=10000&minetype=image/svg+xml" },

      { test: /\.less$/, loader: 'style-loader!css-loader!less-loader' }, // use ! to chain loaders
      { test: /\.css$/, loader: 'style-loader!css-loader' },
      {test: /\.(png|jpg)$/, loader: 'url-loader?limit=8192'},
      
      { test: /\.jsx$/, loaders: ['react-hot', 'jsx?harmony'], exclude: /node_modules/ },
    ]
  },
  resolve: {
    extensions: ['', '.js', '.jsx']
  }
};