title: Webpack : How to optimize the generated bundle.js? It's way too big in my case
body: <p>I'm new to Webpack. I try to use Webpack for two main reasons :</p>
  
  <ul>
  <li>Component management : using <code>require(...)</code></li>
  <li>Performance : smallest size possible, less requests possible to the server.</li>
  </ul>
  
  <p>But with the application I just started (there are currently something like four React components only ), the <code>bundle.js</code> file generated by Webpack is <strong>3.87Mb</strong>!!! </p>
  
  <p>I'm pretty sure Webpack bundles things I won't ever need. I'd like to know how to optimize the generated file... How do I "debug" Webpack's process?</p>
  
  <p>My <code>webpack.config.js</code> :</p>
  
  <pre><code>var webpack = require("webpack");
  
  module.exports = {
      entry: "./app/bootstrap.js",
      output: {
          path: __dirname,
          publicPath: "/public/",
          filename: "bundle.js"
      },
      module: {
          loaders: [
              {
                  test: /\.css$/,
                  loader: "style!css"
              },
              {
                  test: /\.js$/,
                  exclude: /(node_modules|bower_components)/,
                  loader: 'babel-loader'
              },
              {
                  test: /\.js$/,
                  include: /vis/,
                  loader: 'babel-loader'
              },
              {
                  test: /\.(png|woff|woff2|eot|ttf|svg|gif|jpg|jpeg|bmp)(\?.*$|$)/,
                  loader: 'url-loader?limit=100000'
              }
          ]
      },
      plugins: [
          new webpack.ProvidePlugin({
              $: "jquery",
              jQuery: "jquery",
              "window.jQuery": "jquery"
          }),
          new webpack.optimize.UglifyJsPlugin({minimize: true})
      ]
  
  };
  </code></pre>
  
  <p>and <code>package.json</code> :</p>
  
  <pre><code>{
    "name": "XXXXX",
    "version": "1.0.0",
    "main": "",
    "scripts": {
      "dev": "webpack --progress --colors --watch --devtool eval",
      "prod": "webpack --progress --colors"
    },
    "author": "",
    "license": "ISC",
    "dependencies": {
      "alt": "^0.16.10",
      "bootstrap": "^3.3.5",
      "es6-promise": "^2.3.0",
      "i18next-client": "^1.10.2",
      "jquery": "^1.10.2",
      "react": "^0.13.3",
      "react-router": "^0.13.3",
      "toastr": "^2.1.0",
      "vis": "^4.4.0"
    },
    "devDependencies": {
      "css-loader": "^0.15.1",
      "babel-core": "^5.6.18",
      "babel-loader": "^5.3.1",
      "es6-module-loader": "^0.17.3",
      "extract-text-webpack-plugin": "^0.8.2",
      "file-loader": "^0.8.4",
      "node-libs-browser": "^0.5.2",
      "webpack": "^1.9.13",
      "url-loader": "^0.5.6",
      "style-loader": "^0.12.3",
      "webpack-dev-server": "^1.9.0"
    }
  }
  </code></pre>
  
  <p>Any help on how to optimize the generated <code>bundle.js</code>?</p>