const path = require("path");
const TerserJSPlugin = require('terser-webpack-plugin');
const HtmlPlugin = require("html-webpack-plugin");
const HtmlPrefixPlugin = require("html-webpack-prefix-plugin");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const CleanWebpackPlugin = require("clean-webpack-plugin");
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');

module.exports = {
	plugins: [
		new CleanWebpackPlugin(),
		new HtmlPlugin({template: "./ui/masterpage_template.tpl", prefix: 'ui/', filename: "../masterpage.tpl"}),
		new HtmlPrefixPlugin(),
		new MiniCssExtractPlugin({filename: "styles.[contenthash].css"})
	],
	module: {
		rules: [
			{
				// For css...
				test: /\.(css|scss)$/,
				// ...use this loaders
				use: [
					{loader: "style-loader"},
					MiniCssExtractPlugin.loader,
					{loader: "css-loader", options: {url: false,}},
					"sass-loader"
				]
			}
		]
	},
	optimization: {
		minimizer: [
			new TerserJSPlugin(
				// Discard Comments
				{terserOptions: {output: {comments: false}}, parallel: 4}
			),
			new OptimizeCSSAssetsPlugin(
				// Discard Comments
				{cssProcessorPluginOptions: {preset: ['default', {discardComments: {removeAll: true}}],}}
			)
		],
	},
	entry: "./ui/js/index.js",
	output: {
		path: path.resolve(__dirname, "ui/dist/"),
		filename: "bundle.[contenthash].js"
	},
	mode: "production"
};