Minify css из webpack ExtractTextPlugin и стиль-загрузчик

Ответ 1

Таким образом, это произойдет автоматически через загрузчик CSS, если вы явно не отключили его. Поскольку вы задаете вопрос, который я предполагаю, это означает, что у вас есть. UglifyJsPlugin не будет UglifyJsPlugin CSS самостоятельно, если вы извлекаете и не минимизируете.

Для моих нужд мне нужно было извлечь CSS, а затем предоставить как уменьшенную, так и не уменьшенную версию. Таким образом, я столкнулся с той же проблемой, где я мог бы ее минимизировать или не минимизировать, но не оба.

Я смог заставить это работать, используя плагин optimize-css-assets для Webpack. Это позволит вам ExtractTextPlugin извлеченный CSS с помощью ExtractTextPlugin и вы можете установить правило UglifyJsPlugin настройкам UglifyJsPlugin.

По умолчанию этот плагин использует css-nano модуль для сжатия, хотя вы можете поменять его на свой предпочтительный модуль, если хотите.

Вот базовая конфигурация:

plugins: [
  new ExtractTextPlugin('[name].css'),
  new webpack.optimize.UglifyJsPlugin({
    compress: { warnings: false },
    include: /\.min\.js$/
  }),
  new OptimizeCssAssetsPlugin({
    assetNameRegExp: /\.min\.css$/,
    cssProcessorOptions: { discardComments: { removeAll: true } }
  })
]

Ответ 2

Я бы предложил посмотреть на postcss и postcss-loader. Таким образом, как только вы его настроите, вы можете сделать много классных вещей для вас CSS/SCSS, не тратя время на борьбу с webpack.

Ответ 3

Добавление записи для UglifyJsPlugin работает для меня.

plugins: [
    new ExtractTextPlugin("[name].css"),
    new webpack.optimize.UglifyJsPlugin({
        compressor: { warnings: false }
    })
]