phpengine/ui/admin/webpack.config.js

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/dist/clean-webpack-plugin");
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
const webpack = require("webpack");

function getCurrentProjectname() {
	let pathSplit = __dirname.split(path.sep);

	return pathSplit[pathSplit.length - 3];
}

module.exports = {
	plugins: [
		new CleanWebpackPlugin(),
		new HtmlPlugin(
			{
				template: "masterpage_template.tpl",
				filename: path.resolve(__dirname, 'masterpage.tpl')
			}
		),
		new MiniCssExtractPlugin({filename: "styles.[contenthash].css"}),
		new webpack.ProvidePlugin({
			$: 'jquery',
			jQuery: 'jquery',
			'window.jQuery': 'jquery',
			toastr: 'toastr'
		})
	],
	module: {
		rules: [
			{
				// For css...
				test: /\.(css|scss)$/,
				// ...use this loaders
				use: [
					MiniCssExtractPlugin.loader,
					"css-loader",
					"sass-loader"
				]
			},
			// Import various assets
			{test: /\.(jpg|png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000'}
		]
	},
	optimization: {
		minimizer: [
			new TerserJSPlugin(
				// Discard Comments
				{terserOptions: {output: {comments: false}}, parallel: 4}
			),
			new OptimizeCSSAssetsPlugin(
				// Discard Comments
				{cssProcessorPluginOptions: {preset: ['default', {discardComments: {removeAll: true}}]}}
			)
		],
	},
	entry: "./assets/js/index.js",
	output:
		{
			publicPath: '/' + getCurrentProjectname() + '/assets/admin/',
			path: path.resolve(__dirname, "../../assets/admin/"),
			filename: "bundle.[contenthash].js"
		}
};