Skip to content

Instantly share code, notes, and snippets.

Show Gist options
  • Save jsartisan/5f9fbba7ea8b9d90ba29da147cd1ab72 to your computer and use it in GitHub Desktop.
Save jsartisan/5f9fbba7ea8b9d90ba29da147cd1ab72 to your computer and use it in GitHub Desktop.
Final Webpack File
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const StyleExtHtmlWebpackPlugin = require('style-ext-html-webpack-plugin');
const WebpackZipPlugin = require('webpack-zip-plugin');
const isDevelopment = process.env.NODE_ENV === 'development';
let plugins = [];
let imageLoaders = [
{
loader: 'url-loader',
options: {
limit: 5000000,
},
},
];
if (isDevelopment === false) {
plugins = plugins.concat([
new webpack.optimize.UglifyJsPlugin({
compress: {
warnings: false,
screw_ie8: true,
conditionals: true,
unused: true,
comparisons: true,
sequences: true,
dead_code: true,
evaluate: true,
if_return: true,
join_vars: true,
},
output: {
comments: false,
},
}),
new WebpackZipPlugin({
initialFile: 'build',
endPath: './',
zipName: 'build.zip',
}),
]);
imageLoaders = imageLoaders.concat([
{
loader: 'image-webpack-loader',
options: {
bypassOnDebug: true,
},
},
{
loader: 'image-maxsize-webpack-loader',
options: {
'max-width': 1024,
'max-height': 700,
useImageMagick: false,
},
},
]);
}
const config = {
entry: {
bundle: './src/index.js',
},
output: {
filename: isDevelopment ? '[name].js' : '[name]-[hash].js',
path: path.resolve(__dirname, 'build'),
},
module: {
rules: [
{
test: /\.js?$/,
loader: 'babel-loader',
exclude: /node_modules/,
options: {
presets: [
['env', { targets: { browser: ['last 2 versions'] } }],
'react',
'stage-2',
],
},
},
{
test: /\.css$/,
loader: ExtractTextPlugin.extract({
use: [
{
loader: 'css-loader',
},
],
}),
},
{
test: /\.(png|jpg|jpeg|svg)$/,
use: imageLoaders,
},
],
},
plugins: [
new HtmlWebpackPlugin({
template: 'src/index.html',
minify: {
collapseWhitespace: isDevelopment === false,
collapseInlineTagWhitespace: isDevelopment === false,
removeComments: isDevelopment === false,
removeRedundantAttributes: isDevelopment === false,
},
}),
new StyleExtHtmlWebpackPlugin({
minify: isDevelopment === false,
}),
new ExtractTextPlugin('[name].css'),
new CopyWebpackPlugin([
{ from: './src/manifest.json', to: './manifest.json' },
{ from: './src/icon16.png', to: './icon16.png' },
{ from: './src/icon48.png', to: './icon48.png' },
{ from: './src/icon128.png', to: './icon128.png' },
]),
...plugins,
],
};
module.exports = config;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment