Entry/Output

									module.exports = {
										entry: './src/index.js',
										output: {
											filename: 'main.js',
											path: path.resolve(__dirname, 'dist')
										}
										};
									

										npm webpack --config webpack.config.js  
							

Loaders

									module: {
										rules: [
											{
											test: /\.css$/,
											use: [
												'style-loader',
												'css-loader'
											]
											},
											{
											test: /\.(png|svg|jpg|gif)$/,
											use: [
												'file-loader'
											]
											},
											{
											test: /\.(woff|woff2|eot|ttf|otf)$/,
											use: [
												'file-loader'
											]
											}
										]
										}
									
								

Plugins

								plugins: [
										new webpack.optimize.UglifyJsPlugin(),
										new HtmlWebpackPlugin({template: './src/index.html'})
										]
							

Mode

• Production
• Development
• None

									module.exports = {
										mode: 'development'
									  };
							

Development

									devtool: 'inline-source-map'
							

watch mode

webpack-dev-server

webpack-dev-middleware

Production

 UglifyJsPlugin

ModuleConcatenationPlugin

NoEmitOnErrorsPlugin