3 回答

TA貢獻1871條經(jīng)驗 獲得超13個贊
webpack 的默認(rèn) javascript 最小化插件是TerserPlugin。minimizer當(dāng)您在 下設(shè)置屬性時optimizaton,它將覆蓋 webpack 本身提供的默認(rèn)值。要解決此問題,請將 TerserPlugin 添加到webpack.config.js文件中并將其傳遞給minimizer屬性。
const TerserPlugin = require("terser-webpack-plugin");
optimization: {
minimizer: [
new TerserPlugin(),
new OptimizeCssAssetsPlugin(),
new HtmlWebpackPlugin({
minify: {
removeAttributeQuotes: true,
collapseWhitespace: true,
removeComments: true,
},
}),
],
},

TA貢獻1878條經(jīng)驗 獲得超4個贊
看來你只對你的 scss 文件進行最小化,如果你想縮小你的 javascript 文件,你將需要一個插件,如Uglify,你只需將它導(dǎo)入頂部并將其添加到 optimization.minimizer 中,就像它說的那樣在插件頁面示例中:
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
module.exports = {
optimization: {
minimizer: [new UglifyJsPlugin()],
},
};

TA貢獻1784條經(jīng)驗 獲得超9個贊
MiniCssExtractPlugin 會將您的 CSS 提取到一個單獨的文件中,并為每個包含 CSS 的 JS 文件創(chuàng)建一個 CSS 文件。它不會縮小您的 CSS 文件。
導(dǎo)入css-minimizer-webpack-plugin以縮小。您可以根據(jù)您的環(huán)境配置縮小。
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin');
const { getIfUtils } = require('webpack-config-utils')
const {ifProduction, ifNotProduction} = getIfUtils(process.env.NODE_ENV)
module.exports = {
module: {
loaders: [
{
test: /.s?css$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader'],
},
],
},
optimization: {
minimize: ifProduction(true, false),
minimizer: [
new CssMinimizerPlugin(),
],
},
};
添加回答
舉報