title: Preferred way of using Bootstrap in Webpack
body: <p>Greetings one and all,</p>
  
  <p>I have been playing around with Bootstrap for Webpack, but I'm at the point of tearing my hair out. I have literally gone through loads of blog articles and they either use the 7 months outdated 'bootstrap-webpack' plugin (which, surprisingly does not work out of the box) or.. They include the Bootstrap files through import 'node_modules/*/bootstrap/css/bootstrap.css'.</p>
  
  <p>Surely, there must be a cleaner and more efficient way of going about this?</p>
  
  <p>This is my current <code>webpack.config.js</code> file:</p>
  
  <pre><code>var webpack = require('webpack');
  var ExtractTextPlugin = require('extract-text-webpack-plugin');
  var autoprefixer = require('autoprefixer');
  var path = require('path');
  
  module.exports = {
      entry: {
          app: path.resolve(__dirname, 'src/js/main.js')
      },
      module: {
          loaders: [{
              test: /\.js[x]?$/,
              loaders: ['babel-loader?presets[]=es2015&amp;presets[]=react'],
              exclude: /(node_modules|bower_components)/
          }, {
              test: /\.css$/,
              loaders: ['style', 'css']
          }, {
              test: /\.scss$/,
              loaders: ['style', 'css', 'postcss', 'sass']
          }, {
              test: /\.sass$/,
              loader: 'style!css!sass?sourceMap'
          },{
              test: /\.less$/,
              loaders: ['style', 'css', 'less']
          }, {
              test: /\.woff$/,
              loader: "url-loader?limit=10000&amp;mimetype=application/font-woff&amp;name=[path][name].[ext]"
          }, {
              test: /\.woff2$/,
              loader: "url-loader?limit=10000&amp;mimetype=application/font-woff2&amp;name=[path][name].[ext]"
          }, {
              test: /\.(eot|ttf|svg|gif|png)$/,
              loader: "file-loader"
          }]
      },
      output: {
          path: path.resolve(__dirname, 'dist'),
          filename: '/js/bundle.js',
          sourceMapFilename: '/js/bundle.map',
          publicPath: '/'
      },
      plugins: [
          new ExtractTextPlugin('style.css')
      ],
      postcss: [
          autoprefixer({
              browsers: ['last 2 versions']
          })
      ],
      resolve: {
          extensions: ['', '.js', '.sass'],
          modulesDirectories: ['src', 'node_modules']
      },
      devServer: {
          inline: true,
          contentBase: './dist'
      }
  };
  </code></pre>
  
  <p>I could go and <code>require('bootstrap')</code> (with some way of getting jQuery in it to work), but.. I'm curious to what you all think and do. </p>
  
  <p>Thanks in advance :)</p>