I have webpack@4.30.0 project.In development mode webpack --mode=development all files are 7MB.But when I switch to production mode webpack --mode=production they are 27MB :/ Webpack is splitting files in different way:/ I have the same configuration. How to fix it?
Here are bundle maps:development
production
Here is my webpack.config.js:
const webpack = require('webpack');const path = require('path');const MiniCssExtractPlugin = require('mini-css-extract-plugin');var CleanWebpackPlugin = require('clean-webpack-plugin');var GlobEntries = require('webpack-glob-entries');var ManifestPlugin = require('webpack-manifest-plugin');var CopyWebpackPlugin = require('copy-webpack-plugin');const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;var entriesRest = {"style": "./assets/css/style.scss",};var entries = GlobEntries('./assets/js/entries/**/*.ts');const outputDir = 'public';const plugins = [ new webpack.ProgressPlugin(), new webpack.ProvidePlugin({ $: "jquery", jQuery: "jquery","window.jQuery": "jquery", popper: 'popper',"window.popper": 'popper', Popper: 'popper',"window.Popper": 'popper',"L": 'leaflet',"window.L": 'leaflet', }), new MiniCssExtractPlugin({ filename: '../css/style-[contenthash].css', }), new CleanWebpackPlugin(), new ManifestPlugin({ fileName: '../../'+ outputDir +'/manifest.json', generate: (seed, files) => { const entrypoints = new Set() files.forEach( (file) => ((file.chunk || {})._groups || []).forEach( (group) => entrypoints.add(group) ) ) const entries = [...entrypoints] const entryArrayManifest = entries.reduce((acc, entry) => { const name = (entry.options || {}).name || (entry.runtimeChunk || {}).name const files = [].concat( ...(entry.chunks || []).map((chunk) => chunk.files) ).filter(Boolean) return name ? {...acc, [name]: files} : acc }, seed) return entryArrayManifest } }), new CopyWebpackPlugin([ {from: 'node_modules/ckeditor', to: 'ckeditor'}, {from: 'assets/img', to: '../img'}, {from: 'assets/index.php', to: '../index.php'}, {from: 'assets/cron-20min.php', to: '../cron-20min.php'}, {from: 'assets/js/ads.js', to: '../js/ads.js'}, {from: 'assets/.htaccess', to: '../[name].[ext]'}, ]), new webpack.IgnorePlugin(/^\.\/locale$/, /moment$/),];module.exports = (argv, env) => { plugins.push(new BundleAnalyzerPlugin()); return { plugins: [ ...plugins, ], entry: Object.assign(entriesRest, entries), optimization: { splitChunks: { chunks: "all" }, }, devtool: env.mode === 'development' ? 'eval' : '', output: { path: path.resolve(__dirname, outputDir +"/js/"), filename: '[name]-[chunkhash].js',//-[hash:6] }, module: { rules: [ { test: /\.css$/i, use: ['style-loader', 'css-loader'] }, { test: /\.ts$/, loader: 'ts-loader', options: { transpileOnly: true } }, { test: /\.scss$/i, include: [ path.resolve(__dirname, "assets/css/style.scss"), ], use: [ { loader: MiniCssExtractPlugin.loader, options: { // you can specify a publicPath here // by default it uses publicPath in webpackOptions.output // publicPath: '../css/', hmr: process.env.NODE_ENV === 'development', }, },'css-loader', { loader: 'postcss-loader', // Run postcss actions options: { plugins: function () { // postcss plugins, can be exported to postcss.config.js return [ require('autoprefixer') ]; } } }, 'sass-loader' ] }, { test: /\.scss$/i, exclude: [ path.resolve(__dirname, "assets/css/style.scss"), ], loader: ['style-loader', 'css-loader', 'sass-loader'] }, { test: /\.woff(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff&name=../css/fonts/[name].[ext]" }, { test: /\.woff2(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=application/font-woff&name=../css/fonts/[name].[ext]" }, { test: /\.ttf(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=application/octet-stream&name=../css/fonts/[name].[ext]" }, { test: /\.eot(\?v=\d+\.\d+\.\d+)?$/, loader: "file-loader?name=../css/fonts/[name].[ext]" }, { test: /\.svg(\?v=\d+\.\d+\.\d+)?$/, loader: "url-loader?limit=10000&mimetype=image/svg+xml&name=../css/fonts/[name].[ext]" }, { test: /\.(jpe?g|png|gif|svg|cur)$/i, loaders: ['file-loader?hash=sha512&digest=hex&name=../img/[name].[ext]','image-webpack-loader?bypassOnDebug&optimizationLevel=7&interlaced=false' ] }, {test: /\.twig$/, loader: "twig-loader"} ] }, resolve: { extensions: ['.ts', '.tsx', '.js', '.jsx'], alias: {'jquery-ui': path.resolve(__dirname, 'node_modules/jquery-ui/ui'), } } };};