/* * @Author: Johnhong9527 * @Date: 2020-05-12 16:35:36 * @Last Modified by: Johnhong9527 * @Last Modified time: 2020-05-12 16:35:44 */ const merge = require("webpack-merge"); const common = require("./webpack.common.config.js"); const HtmlWebpackPlugin = require("html-webpack-plugin"); const { CleanWebpackPlugin } = require("clean-webpack-plugin"); const UglifyJsPlugin = require("uglifyjs-webpack-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin"); module.exports = merge(common, { mode: "production", module: { rules: [ { test: /\.css$/, use: [MiniCssExtractPlugin.loader, "css-loader", "postcss-loader"] }, { test: /\.less$/, use: [ MiniCssExtractPlugin.loader, "css-loader", "less-loader", "postcss-loader" ] } // { // test: /\.(scss|sass)$/, // use: [ // MiniCssExtractPlugin.loader, // 'css-loader', // 'postcss-loader', // 'sass-loader' // ] // }, ] }, plugins: [ new HtmlWebpackPlugin({ filename: "index.html", template: "public/index.html", inject: "body", minify: { removeComments: true, collapseWhitespace: true } }), new CleanWebpackPlugin(), new MiniCssExtractPlugin({ filename: "css/[name].[hash].css", chunkFilename: "css/[id].[hash].css" }) ], optimization: { minimizer: [ new UglifyJsPlugin(), new OptimizeCssAssetsPlugin({ assetNameRegExp: /\.css$/g, cssProcessor: require("cssnano"), cssProcessorPluginOptions: { preset: ["default", { discardComments: { removeAll: true } }] }, canPrint: true }) ], splitChunks: { chunks: "all", minSize: 30000, maxSize: 0, minChunks: 1, cacheGroups: { framework: { test: "framework", name: "framework", enforce: true }, vendors: { priority: -10, test: /node_modules/, name: "vendor", enforce: true } } } } });