const MiniCssExtractPlugin = require('mini-css-extract-plugin'), Path = require('path'), AssetsPlugin = require('assets-webpack-plugin'), CopyPlugin = require('copy-webpack-plugin'); const CssMinimizerPlugin = require("css-minimizer-webpack-plugin"); const PUBLIC_FOLDER = Path.resolve(__dirname, 'public'), SOURCE_FOLDER = Path.resolve(__dirname, 'src'), JS_FOLDER = Path.resolve(SOURCE_FOLDER, 'js'), CSS_FOLDER = Path.resolve(SOURCE_FOLDER, 'css'), PHP_FOLDER = Path.resolve(SOURCE_FOLDER, 'php'); const PROD = false; const INDEX_PATH = Path.resolve(PHP_FOLDER, PROD ? 'index.prod.php' : 'index.dev.php'); module.exports = { plugins: [ new AssetsPlugin({ filename: 'file-index.json', path: SOURCE_FOLDER, includeAllFileTypes: false, entrypoints: true, removeFullPathAutoPrefix: true }), new MiniCssExtractPlugin({ filename: 'css/[name].css' }), new CopyPlugin({ patterns: [ { from: INDEX_PATH, to: PUBLIC_FOLDER + '/index.php' }, ] }) ], mode: PROD ? 'production' : 'development', devtool: 'source-map', optimization: { runtimeChunk: "single", minimize: true, minimizer: [ new CssMinimizerPlugin() ], splitChunks: { cacheGroups: { vendor: { test: /[\\/]node_modules[\\/]/, name: 'vendors', chunks: 'all', }, common: { test: /[\\/]common[\\/]/, name: 'common', chunks: 'all' } }, }, }, module: { rules: [ { test: /\.css$/i, use: [ MiniCssExtractPlugin.loader, 'css-loader' ], }, { test: /\.scss$/i, use: [ MiniCssExtractPlugin.loader, 'css-loader', 'resolve-url-loader', "sass-loader" ] }, { test: /\.ts$/i, use: 'ts-loader', exclude: /node_modules/, }, { test: /\.(woff|woff2|eot|ttf|otf|gif|svg)$/i, type: 'asset/resource', } ], }, resolve: { extensions: ['.js', '.ts'], fallback: { 'bootstrap5-autocomplete/types/autocomplete': 'bootstrap5-autocomplete' } }, entry: { index: JS_FOLDER + "/pages/index", 'admin/accounts': JS_FOLDER + "/pages/admin/accounts", keys: JS_FOLDER + "/pages/keys/index", }, output: { path: PUBLIC_FOLDER, filename: 'js/[name].js' } }