{"id":21082205,"url":"https://github.com/olsonpm/postcss-create-mq-ast","last_synced_at":"2025-08-19T15:03:39.030Z","repository":{"id":57327907,"uuid":"126116481","full_name":"olsonpm/postcss-create-mq-ast","owner":"olsonpm","description":null,"archived":false,"fork":false,"pushed_at":"2018-03-21T07:38:45.000Z","size":7,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":2,"default_branch":"dev","last_synced_at":"2025-05-07T21:02:26.544Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"other","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/olsonpm.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"license.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2018-03-21T03:14:07.000Z","updated_at":"2018-03-21T07:38:46.000Z","dependencies_parsed_at":"2022-09-16T07:21:32.846Z","dependency_job_id":null,"html_url":"https://github.com/olsonpm/postcss-create-mq-ast","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/olsonpm/postcss-create-mq-ast","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olsonpm%2Fpostcss-create-mq-ast","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olsonpm%2Fpostcss-create-mq-ast/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olsonpm%2Fpostcss-create-mq-ast/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olsonpm%2Fpostcss-create-mq-ast/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/olsonpm","download_url":"https://codeload.github.com/olsonpm/postcss-create-mq-ast/tar.gz/refs/heads/dev","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/olsonpm%2Fpostcss-create-mq-ast/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":271172957,"owners_count":24711663,"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","status":"online","status_checked_at":"2025-08-19T02:00:09.176Z","response_time":63,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"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":[],"created_at":"2024-11-19T20:13:08.153Z","updated_at":"2025-08-19T15:03:39.002Z","avatar_url":"https://github.com/olsonpm.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# Postcss - Create Media Query AST\n\n\u003c!-- START doctoc generated TOC please keep comment here to allow auto update --\u003e\n\u003c!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --\u003e\n**Table of Contents**\n- [What is it](#what-is-it)\n- [Install](#install)\n- [Usage](#usage)\n- [Why create it](#why-create-it)\n- [Example](#example)\n\n\u003c!-- END doctoc generated TOC please keep comment here to allow auto update --\u003e\n\n## What is it\n\nThis very simple plugin walks through media [AtRules](http://api.postcss.org/AtRule.html) and attaches the property `preludeCssTreeAst`. This property is an instance of [AtrulePrelude](https://github.com/csstree/csstree/blob/master/docs/ast.md#atruleprelude) and can be traversed via the apis made available by [csstree](https://github.com/csstree/csstree).\n\n\n## Install\n\n`npm install postcss-create-mq-ast`\n\n\n## Usage\n\nJust the same as any other postcss plugin\n\n```js\nconst createMqAst = require('postcss-create-mq-ast')\npostcss([createMqAst()])\n  .process(...)\n```\n\n\n## Why create it\n\nI needed an ast in order to create [postcss-remove-duplicate-mq](https://github.com/olsonpm/postcss-remove-duplicate-mq)\n\nPostcss doesn't parse media queries and instead leaves them as a [params](http://api.postcss.org/AtRule.html#params)\nproperty on the media [AtRule](http://api.postcss.org/AtRule.html)\n\nThere exists the [postcss-media-query-parser](https://www.npmjs.com/package/postcss-media-query-parser) but that doesn't use the exposed ast structures provided by postcss (possibly because they didn't exist when it was written). It also is outdated and not maintained.\n\nI chose to use csstree's ast because postcss has plans to utilize csstree's parser down the road.\n\n\n## Example\n\nGiven the following css\n\n```css\n/* test.css */\n\n@media (min-width: 500px) {\n  body {\n    background-color: blue;\n  }\n}\n```\n\n[Here's a snippet](./at-rule-ast-example.json) of the resulting AtRule node\n\n*Keep in mind the csstree AST isn't pure json.  They override `toJSON` to provide that structure when printed*\n\nFor an example of traversing this property, see [postcss-remove-duplicate-mq](https://github.com/olsonpm/postcss-remove-duplicate-mq).  The apis I found most useful are csstree's [walk](https://github.com/csstree/csstree/blob/master/docs/traversal.md) and its (linked) [List](https://github.com/csstree/csstree/blob/master/docs/List.md)\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Folsonpm%2Fpostcss-create-mq-ast","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Folsonpm%2Fpostcss-create-mq-ast","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Folsonpm%2Fpostcss-create-mq-ast/lists"}