Skip to content

Instantly share code, notes, and snippets.

@praveenperera
Created December 17, 2019 14:38
Show Gist options
  • Save praveenperera/bf7bd0d4184e7b172b7d0acf4e7d316d to your computer and use it in GitHub Desktop.
Save praveenperera/bf7bd0d4184e7b172b7d0acf4e7d316d to your computer and use it in GitHub Desktop.
webpack.config.js (2019)
const path = require("path");
const glob = require("glob");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const UglifyJsPlugin = require("uglifyjs-webpack-plugin");
const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin");
const WebpackNotifierPlugin = require("webpack-notifier");
const CopyWebpackPlugin = require("copy-webpack-plugin");
const isProduction = process.env.NODE_ENV === "production";
const ImageminPlugin = require("imagemin-webpack-plugin").default;
module.exports = (env, options) => ({
optimization: {
minimizer: [
new UglifyJsPlugin({ cache: true, parallel: true, sourceMap: false }),
new OptimizeCSSAssetsPlugin({})
]
},
entry: {
app: ["./js/app.js"].concat(glob.sync("./vendor/**/*.js")),
react: ["./js/react.js"]
},
output: {
filename: "[name].js",
path: path.resolve(__dirname, "../priv/static/js")
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: "babel-loader"
}
},
{
test: /\.css$/,
use: [
MiniCssExtractPlugin.loader,
{ loader: "css-loader", options: { importLoaders: 1 } },
"postcss-loader"
]
}
]
},
plugins: [
new MiniCssExtractPlugin({ filename: "../css/app.css" }),
new CopyWebpackPlugin([{ from: "static/", to: "../" }]),
...(isProduction
? [
new ImageminPlugin({
test: /\.(jpe?g|png|gif|svg)$/i
})
]
: [new WebpackNotifierPlugin()])
]
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment