const path = require("path"); const TerserJSPlugin = require('terser-webpack-plugin'); const HtmlPlugin = require("html-webpack-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const { CleanWebpackPlugin } = require("clean-webpack-plugin"); const OptimizeCSSAssetsPlugin = require('css-minimizer-webpack-plugin'); const webpack = require("webpack"); function getCurrentProjectname() { let pathSplit = __dirname.split(path.sep); return pathSplit[pathSplit.length - 1]; } module.exports = { stats: { errorDetails: true, }, plugins: [ new CleanWebpackPlugin(), new HtmlPlugin( { template: "./ui/frontend/errors_template.tpl", filename: path.resolve(__dirname, './ui/frontend/errors.tpl'), chunks: ["frontend"] } ), new HtmlPlugin( { template: "./ui/frontend/masterpage_template.tpl", filename: path.resolve(__dirname, './ui/frontend/masterpage.tpl'), chunks: ["frontend"] } ), new MiniCssExtractPlugin({ filename: "styles.[contenthash].css" }), new webpack.ProvidePlugin({ $: 'jquery', jQuery: 'jquery', "window.jQuery": 'jquery' }) ], module: { rules: [ { // For css... test: /\.(css|scss)$/, // ...use this loaders use: [ { loader: MiniCssExtractPlugin.loader }, { loader: "css-loader" }, { loader: "sass-loader" } ] }, // Import various assets { test: /\.(jpg|png|woff|woff2|eot|ttf|svg)$/, use: [ { loader: 'url-loader', options: '?limit=100000' } ] } ] }, optimization: { minimizer: [ new TerserJSPlugin( // Discard Comments { terserOptions: { output: { comments: false } }, parallel: 4 } ), new OptimizeCSSAssetsPlugin( // Discard Comments { minimizerOptions: { preset: ['default', { discardComments: { removeAll: true } }] } } ) ], }, entry: { "frontend": "./ui/frontend/js/frontend.js" }, output: { publicPath: '/' + getCurrentProjectname() + '/assets/frontend/', path: path.resolve(__dirname, "assets/frontend/"), filename: "[name].[contenthash].js" }, };