const webpack = require('webpack'); const webpackMerge = require('webpack-merge'); const MiniCssExtractPlugin = require('mini-css-extract-plugin'); const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin"); const Visualizer = require('webpack-visualizer-plugin'); const MomentLocalesPlugin = require('moment-locales-webpack-plugin'); const TerserPlugin = require('terser-webpack-plugin'); const WorkboxPlugin = require('workbox-webpack-plugin'); const AngularCompilerPlugin = require('@ngtools/webpack').AngularCompilerPlugin; const path = require('path'); const utils = require('./utils.js'); const commonConfig = require('./webpack.common.js'); const ENV = 'production'; const sass = require('sass'); module.exports = webpackMerge(commonConfig({ env: ENV }), { // Enable source maps. Please note that this will slow down the build. // You have to enable it in UglifyJSPlugin config below and in tsconfig-aot.json as well // devtool: 'source-map', entry: { polyfills: './src/main/webapp/app/polyfills', global: './src/main/webapp/content/scss/global.scss', main: './src/main/webapp/app/app.main' }, output: { path: utils.root('target/classes/public'), filename: 'app/[name].[hash].bundle.js', chunkFilename: 'app/[id].[hash].chunk.js' }, module: { rules: [{ test: /(?:\.ngfactory\.js|\.ngstyle\.js|\.ts)$/, loader: '@ngtools/webpack' }, { test: /\.scss$/, use: ['to-string-loader', 'css-loader', { loader: 'sass-loader', options: { implementation: sass } }], exclude: /(vendor\.scss|global\.scss)/ }, { test: /(vendor\.scss|global\.scss)/, use: [ MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader', { loader: 'sass-loader', options: { implementation: sass } } ] }, { test: /\.css$/, use: ['to-string-loader', 'css-loader'], exclude: /(vendor\.css|global\.css)/ }, { test: /(vendor\.css|global\.css)/, use: [ MiniCssExtractPlugin.loader, 'css-loader', 'postcss-loader' ] }] }, optimization: { runtimeChunk: false, splitChunks: { cacheGroups: { commons: { test: /[\\/]node_modules[\\/]/, name: 'vendors', chunks: 'all' } } }, minimizer: [ new TerserPlugin({ parallel: true, cache: true, terserOptions: { ie8: false, // sourceMap: true, // Enable source maps. Please note that this will slow down the build compress: { dead_code: true, warnings: false, properties: true, drop_debugger: true, conditionals: true, booleans: true, loops: true, unused: true, toplevel: true, if_return: true, inline: true, join_vars: true }, output: { comments: false, beautify: false, indent_level: 2 } } }), new OptimizeCSSAssetsPlugin({}) ] }, plugins: [ new MiniCssExtractPlugin({ // Options similar to the same options in webpackOptions.output // both options are optional filename: '[name].[contenthash].css', chunkFilename: '[id].css' }), new MomentLocalesPlugin({ localesToKeep: [ 'en', 'es' // jhipster-needle-i18n-language-moment-webpack - JHipster will add/remove languages in this array ] }), new Visualizer({ // Webpack statistics in target folder filename: '../stats.html' }), new AngularCompilerPlugin({ mainPath: utils.root('src/main/webapp/app/app.main.ts'), tsConfigPath: utils.root('tsconfig-aot.json'), sourceMap: true }), new webpack.LoaderOptionsPlugin({ minimize: true, debug: false }), new WorkboxPlugin.GenerateSW({ clientsClaim: true, skipWaiting: true, }) ], mode: 'production' });