{"library":"postcss-assets-webpack-plugin","title":"postcss-assets-webpack-plugin","description":"A Webpack plugin that applies PostCSS transformations to CSS assets emitted by MiniCssExtractPlugin after all files are compiled. Version 4.1.2 supports Webpack 4 and 5 with PostCSS 8, requiring Node >=10. Unlike postcss-loader which processes files individually, this plugin enables whole-bundle optimizations like media query packing and minimization. It is stable with infrequent releases and no known security issues.","language":"javascript","status":"active","last_verified":"Sat Apr 25","install":{"commands":["npm install postcss-assets-webpack-plugin"],"cli":null},"imports":["import PostCSSAssetsPlugin from 'postcss-assets-webpack-plugin'","// No type import; plugin is not typed\n// Use @types/postcss-assets-webpack-plugin if available","const PostCSSAssetsPlugin = require('postcss-assets-webpack-plugin').default"],"auth":{"required":false,"env_vars":[]},"quickstart":{"code":"import webpack from 'webpack';\nimport csswring from 'csswring';\nimport mqpacker from 'mqpacker';\nimport autoprefixer from 'autoprefixer';\nimport MiniCssExtractPlugin from 'mini-css-extract-plugin';\nimport PostCSSAssetsPlugin from 'postcss-assets-webpack-plugin';\n\nconst devMode = process.env.NODE_ENV !== 'production';\n\nexport default {\n  entry: './src/index.js',\n  module: {\n    rules: [\n      {\n        test: /\\.css$/,\n        use: [\n          devMode ? 'style-loader' : MiniCssExtractPlugin.loader,\n          'css-loader',\n          'postcss-loader'\n        ]\n      }\n    ]\n  },\n  plugins: [\n    new MiniCssExtractPlugin({\n      filename: devMode ? '[name].css' : '[name].[contenthash].css'\n    }),\n    new PostCSSAssetsPlugin({\n      test: /\\.css$/,\n      plugins: [\n        mqpacker(),\n        csswring({ preservehacks: true, removeallcomments: true })\n      ],\n      log: !devMode\n    })\n  ]\n}","lang":"javascript","description":"Configures Webpack to extract CSS with MiniCssExtractPlugin and then apply PostCSS plugins (mqpacker and csswring) to the bundled CSS using postcss-assets-webpack-plugin.","tag":null,"tag_description":null,"last_tested":null,"results":[]},"compatibility":null}