import {fileURLToPath}      from 'url';
import path                 from 'path';
import webpack              from 'webpack';
import sass                 from 'sass';
import MiniCssExtractPlugin from 'mini-css-extract-plugin';
import VueLoaderPlugin      from 'vue-loader/lib/plugin.js';

const __filename = fileURLToPath(import.meta.url);
const __dirname  = path.dirname(__filename);

export default {
	mode: 'production',
	entry: {
		app: [
			'./src/css/app.scss',
			'./src/app.js',
		],
		view: [
			'./src/css/view.scss',
			'./src/view.js',
		],
	},

	output: {
		path: path.resolve(__dirname, './public/dist'),
		publicPath: '/dist',
		filename: '[name].js',
	},

	module: {
		rules: [
			{
				test: /\.vue$/,
				loader: 'vue-loader',
			},
			{
				test: /\.scss$/,
				use: [
					{
						loader: MiniCssExtractPlugin.loader,
					},
					'css-loader',
					{
						loader: 'sass-loader',
						options: {
							implementation: sass,
						},
					},
				],
			},
		],
	},
	resolve: {
		alias: {
			vue$: 'vue/dist/vue.esm.js',
		},
	},
	performance: {
		hints: false,
	},
	devtool: false,
	plugins: [
		new VueLoaderPlugin(),
		new webpack.LoaderOptionsPlugin({
			minimize: true,
		}),
		new MiniCssExtractPlugin({
			filename: '[name].css',
		}),
	],
};