geopattern adds a large chunk after webpack build

[aviaryan]

I see that the minified version of geopattern in this repository is <20kb.
But when I bundle geopattern using webpack, it increases the size of the bundle by around 36kb.
What could be going wrong here?
I am importing geopattern as import GeoPattern from 'geopattern'.
My package.json has only the vendor packages as dependencies.

PS - Sorry, I know this is not the best place to ask this question but I couldn't find anything else.

const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
	entry: {
		app: './src/index.jsx',
		vendor: ['react', 'react-dom', 'geopattern', 'react-router-dom', 'redux']
	},
	module: {
		loaders: [{
			test: /\.jsx?$/,
			exclude: /node_modules/,
			loader: 'babel-loader',
			query: {
				presets: ['es2015', 'react']
			}
		}, {
			test: /\.css$/,
			use:  ExtractTextPlugin.extract({
				use: [{
					loader: 'css-loader',
					options: { importLoaders: 1, modules: true, localIdentName: '[local]-[hash:base64:5]' },
				}],
			}),
		}]
	},
	resolve: {
		extensions: ['.js', '.jsx']
	},
	output: {
		path: __dirname + '/dist',
		publicPath: '/dist/',
		filename: 'bundle.js'
	},
	plugins: [
		// extract text
		new ExtractTextPlugin("styles.css"),
		// minify
		new webpack.optimize.UglifyJsPlugin({
			mangle: true,
			compress: {
				warnings: false, // Suppress uglification warnings
				pure_getters: true,
				unsafe: true,
				unsafe_comps: true,
				screw_ie8: true,
				conditionals: true,
				unused: true,
				comparisons: true,
				sequences: true,
				dead_code: true,
				evaluate: true,
				if_return: true,
				join_vars: true
			},
			comments: false
		}),
		// vendor: https://webpack.github.io/docs/code-splitting.html#split-app-and-vendor-code
		new webpack.optimize.CommonsChunkPlugin({name: 'vendor', filename: 'vendor.bundle.js'})
	]
};

[btmills]

If I had to guess, webpack is including the buffer shim in the bundle. The Browserify build ignores Node's buffer module because it's an optional fallback that isn't necessary in the browser. There's a webpack issue that talks about excluding buffer. Maybe try that? And if that works, I'd love a PR to add webpack bundling instructions to the readme based on what you find! 💖

[aviaryan]

@btmills Thanks. Adding a node: { Buffer: false } worked. Reduced bundle size by 22kb.
I will send a PR for this tomorrow.

EDIT - Final webpack config looks something like the following.

const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {
	entry: {
		app: './src/index.jsx',
		vendor: ['react', 'react-dom', 'geopattern', 'react-router-dom', 'redux']
	},
	module: {
		loaders: [
		// loaders
		]
	},
	resolve: {
		extensions: ['.js', '.jsx']
	},
	output: {
		path: __dirname + '/dist',
		publicPath: '/dist/',
		filename: 'bundle.js'
	},
	node: { Buffer: false }, 
	plugins: [
		// plugins
	]
};