{"id":19125125,"url":"https://github.com/shoonia/css-mqpacker-webpack-plugin","last_synced_at":"2025-05-05T20:14:01.250Z","repository":{"id":45183823,"uuid":"286996878","full_name":"shoonia/css-mqpacker-webpack-plugin","owner":"shoonia","description":"The Webpack plugin for pack same CSS media query rules into one using PostCSS","archived":false,"fork":false,"pushed_at":"2024-03-31T11:51:53.000Z","size":131,"stargazers_count":3,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-05-05T20:13:56.059Z","etag":null,"topics":["postcss","webpack","webpack-plugin"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/shoonia.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-08-12T11:32:13.000Z","updated_at":"2023-06-25T17:08:04.000Z","dependencies_parsed_at":"2023-01-18T08:30:48.281Z","dependency_job_id":"a0d03281-306b-428c-9a7a-784f30ae4207","html_url":"https://github.com/shoonia/css-mqpacker-webpack-plugin","commit_stats":{"total_commits":71,"total_committers":3,"mean_commits":"23.666666666666668","dds":"0.14084507042253525","last_synced_commit":"7c97e1ebab754b44a3e972c14f251788c9e885ba"},"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shoonia%2Fcss-mqpacker-webpack-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shoonia%2Fcss-mqpacker-webpack-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shoonia%2Fcss-mqpacker-webpack-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/shoonia%2Fcss-mqpacker-webpack-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/shoonia","download_url":"https://codeload.github.com/shoonia/css-mqpacker-webpack-plugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252569646,"owners_count":21769517,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["postcss","webpack","webpack-plugin"],"created_at":"2024-11-09T05:34:38.901Z","updated_at":"2025-05-05T20:14:01.229Z","avatar_url":"https://github.com/shoonia.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# css-mqpacker-webpack-plugin\n\n[![npm version](https://img.shields.io/npm/v/css-mqpacker-webpack-plugin.svg)](https://www.npmjs.com/package/css-mqpacker-webpack-plugin)\n\nThe Webpack plugin for pack same CSS media query rules into one using [PostCSS](https://github.com/postcss/postcss).\n\n\u003e [node-css-mqpacker](https://github.com/hail2u/node-css-mqpacker)\n\n**Before:**\n\n```css\n.foo {\n  width: 240px;\n}\n\n@media (max-width: 768px) {\n  .foo {\n    width: 576px;\n  }\n}\n\n.bar {\n  width: 160px;\n}\n\n@media (max-width: 768px) {\n  .bar {\n    width: 384px;\n  }\n}\n```\n\n**After:**\n\n```css\n.foo {\n  width: 240px;\n}\n\n.bar {\n  width: 160px;\n}\n\n@media (max-width: 768px) {\n  .foo {\n    width: 576px;\n  }\n\n  .bar {\n    width: 384px;\n  }\n}\n```\n\n## Install\n\n```bash\nnpm i css-mqpacker-webpack-plugin --save-dev\n# or\nyarn add css-mqpacker-webpack-plugin -D\n```\n\n## Example\n\n**webpack.config.js**\n\n```js\nconst CssMqpackerPlugin = require('css-mqpacker-webpack-plugin');\n\nmodule.exports = {\n  optimization: {\n    minimize: true,\n    minimizer: [\n      new CssMqpackerPlugin(),\n    ],\n  },\n};\n```\n\n## Options\n\n### `test`\n\nType: `String|RegExp|Array\u003cString|RegExp\u003e` Default: `/\\.css(\\?.*)?$/i`\n\nTest to match files against.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  optimization: {\n    minimize: true,\n    minimizer: [\n      new CssMqpackerPlugin({\n        test: /\\.foo\\.css$/i,\n      }),\n    ],\n  },\n};\n```\n\n### `include`\n\nType: `String|RegExp|Array\u003cString|RegExp\u003e` Default: `undefined`\n\nFiles to include.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  optimization: {\n    minimize: true,\n    minimizer: [\n      new CssMqpackerPlugin({\n        include: /\\/includes/,\n      }),\n    ],\n  },\n};\n```\n\n### `exclude`\n\nType: `String|RegExp|Array\u003cString|RegExp\u003e` Default: `undefined`\n\nFiles to exclude.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  optimization: {\n    minimize: true,\n    minimizer: [\n      new CssMqpackerPlugin({\n        exclude: /\\/excludes/,\n      }),\n    ],\n  },\n};\n```\n\n### `sort`\n\nType: `Boolean|Function` Default: `false`\n\nBy default, CSS MQPacker pack and order media queries as they are defined ([the “first win” algorithm](https://github.com/hail2u/node-css-mqpacker#the-first-win-algorithm)). If you want to sort media queries automatically, pass `sort: true`.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  optimization: {\n    minimize: true,\n    minimizer: [\n      new CssMqpackerPlugin({\n        sort: true,\n      }),\n    ],\n  },\n};\n```\n\n## License\n\n[MIT](./LICENSE)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshoonia%2Fcss-mqpacker-webpack-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fshoonia%2Fcss-mqpacker-webpack-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fshoonia%2Fcss-mqpacker-webpack-plugin/lists"}