第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Webpack 沒有最小化生產(chǎn)中的 JavaScript 文件

Webpack 沒有最小化生產(chǎn)中的 JavaScript 文件

慕絲7291255 2023-06-29 21:05:49
我是 React.js 新手,目前正在開發(fā)一個 React.js 項目,該項目在開發(fā)環(huán)境下運行 100% 正常,沒有任何錯誤。當(dāng)我在生產(chǎn)模式下構(gòu)建項目后,它不會縮小我的 javascript 文件。但我的 scss 文件被縮小了。const path = require("path");const CleanWebpackPlugin = require("clean-webpack-plugin");const MiniCssExtractPlugin = require("mini-css-extract-plugin");const OptimizeCssAssetsPlugin = require("optimize-css-assets-webpack-plugin");const HtmlWebpackPlugin = require("html-webpack-plugin");module.exports = {  mode: "production",  entry: {    main: "./src/index.js",    vendor: "./src/vendor.js",  },  output: {    filename: "[name].[contentHash].bundle.js",    path: path.resolve(__dirname, "dist"),  },  module: {    rules: [      {        test: /\.html$/,        use: ["html-loader"],      },      {        test: /\.(svg|png|jpg|gif)$/,        use: {          loader: "file-loader",          options: {            name: "[name].[hash].[ext]",            outputPath: "imgs",          },        },      },      {        test: /\.scss$/,        use: [MiniCssExtractPlugin.loader, "css-loader", "sass-loader"],      },    ],  },  optimization: {    minimizer: [      new OptimizeCssAssetsPlugin(),      new HtmlWebpackPlugin({        template: __dirname + "/app/index.html",        minify: {          removeAttributeQuotes: true,          collapseWhitespace: true,          removeComments: true,        },      }),    ],  },  plugins: [    new MiniCssExtractPlugin({ filename: "[name].[contentHash].css" }),    new CleanWebpackPlugin(),  ],};請有人幫助我解決這個問題,并對我的英語不好表示歉意。
查看完整描述

3 回答

?
慕桂英4014372

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,

      },

    }),

  ],

},


查看完整回答
反對 回復(fù) 2023-06-29
?
UYOU

TA貢獻1878條經(jīng)驗 獲得超4個贊

看來你只對你的 scss 文件進行最小化,如果你想縮小你的 javascript 文件,你將需要一個插件,如Uglify,你只需將它導(dǎo)入頂部并將其添加到 optimization.minimizer 中,就像它說的那樣在插件頁面示例中:


const UglifyJsPlugin = require('uglifyjs-webpack-plugin');

 

module.exports = {

  optimization: {

    minimizer: [new UglifyJsPlugin()],

  },

};


查看完整回答
反對 回復(fù) 2023-06-29
?
千萬里不及你

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(),

    ],

  },

};


查看完整回答
反對 回復(fù) 2023-06-29
  • 3 回答
  • 0 關(guān)注
  • 201 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號