const autoprefixer = require("autoprefixer");
const path = require("path");

function tryResolve_(url, sourceFilename) {
	// Put require.resolve in a try/catch to avoid node-sass failing with cryptic libsass errors
	// when the importer throws
	try {
		return require.resolve(url, { paths: [path.dirname(sourceFilename)] });
	} catch (e) {
		return "";
	}
}

function tryResolveScss(url, sourceFilename) {
	// Support omission of .scss and leading _
	const normalizedUrl = url.endsWith(".scss") ? url : `${url}.scss`;
	return (
		tryResolve_(normalizedUrl, sourceFilename) ||
		tryResolve_(
			path.join(
				path.dirname(normalizedUrl),
				`_${path.basename(normalizedUrl)}`
			),
			sourceFilename
		)
	);
}

function materialImporter(url, prev) {
	if (url.startsWith("@material")) {
		const resolved = tryResolveScss(url, prev);
		return { file: resolved || url };
	}
	return { file: url };
}

module.exports = [
	{
		entry: {
			app: ["./src/app.scss", "./src/app.js"],
		},
		output: {
			filename: "[name].js",
		},
		mode: "production",
		module: {
			rules: [
				{
					test: /\.(css|scss)$/,
					use: [
						{
							loader: "file-loader",
							options: {
								name: "[name].css",
							},
						},
						{
							loader: "extract-loader",
						},
						{
							loader: "css-loader",
						},
						{
							loader: "postcss-loader",
							options: {
								postcssOptions: {
									plugins: [autoprefixer()],
								},
							},
						},
						{
							loader: "sass-loader",
							options: {
								implementation: require("sass"),
								webpackImporter: false,
								sassOptions: {
									importer: materialImporter,
									includePaths: ["./node_modules"],
								},
							},
						},
					],
				},
				{
					test: /\.js$/,
					use: [
						{
							loader: "babel-loader",
							options: {
								presets: ["@babel/preset-env"],
							},
						},
					],
				},
			],
		},
	},
];