{"id":20464948,"url":"https://github.com/stylus/postcss-styl","last_synced_at":"2025-04-13T08:42:38.278Z","repository":{"id":36955796,"uuid":"504092360","full_name":"stylus/postcss-styl","owner":"stylus","description":"PostCSS parser plugin for converting Stylus syntax to PostCSS AST","archived":false,"fork":false,"pushed_at":"2025-01-15T00:35:18.000Z","size":3307,"stargazers_count":9,"open_issues_count":3,"forks_count":0,"subscribers_count":5,"default_branch":"main","last_synced_at":"2025-03-20T11:47:57.654Z","etag":null,"topics":["postcss","stylus"],"latest_commit_sha":null,"homepage":"https://stylus.github.io/postcss-styl","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/stylus.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","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},"funding":{"github":["ota-meshi","stylus"],"patreon":null,"open_collective":"stylus","ko_fi":null,"tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2022-06-16T09:26:19.000Z","updated_at":"2024-05-12T17:35:59.000Z","dependencies_parsed_at":"2024-06-18T20:37:22.689Z","dependency_job_id":null,"html_url":"https://github.com/stylus/postcss-styl","commit_stats":{"total_commits":175,"total_committers":6,"mean_commits":"29.166666666666668","dds":0.5542857142857143,"last_synced_commit":"9621d6e91d12478c35bda84e7e6d7ecedb348453"},"previous_names":[],"tags_count":43,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stylus%2Fpostcss-styl","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stylus%2Fpostcss-styl/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stylus%2Fpostcss-styl/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/stylus%2Fpostcss-styl/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/stylus","download_url":"https://codeload.github.com/stylus/postcss-styl/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248687501,"owners_count":21145719,"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","stylus"],"created_at":"2024-11-15T13:16:53.319Z","updated_at":"2025-04-13T08:42:38.259Z","avatar_url":"https://github.com/stylus.png","language":"JavaScript","funding_links":["https://github.com/sponsors/ota-meshi","https://github.com/sponsors/stylus","https://opencollective.com/stylus"],"categories":[],"sub_categories":[],"readme":"# postcss-styl\n\n[![NPM license]](https://www.npmjs.com/package/postcss-styl)\n[![NPM version]](https://www.npmjs.com/package/postcss-styl)\n[![NPM downloads]](https://www.npmjs.com/package/postcss-styl)\n[![Build Status]](https://github.com/stylus/postcss-styl/actions?query=workflow%3ACI)\n[![Coverage Status]](https://coveralls.io/github/stylus/postcss-styl?branch=main)\n\n[PostCSS] parser plugin for converting [Stylus] syntax to [PostCSS] AST.\n\n:::\n**_This plugin is still in an experimental state_**\n:::\n\n## Installation\n\n```bash\nnpm install -D postcss-styl\n```\n\n## Usage\n\n### Lint Stylus with [stylelint]\n\nYou can use this [PostCSS] plugin to apply [Stylus] syntax to [stylelint].  \n**You can use it more easily by using it with [stylelint-stylus](https://github.com/stylus/stylelint-stylus).**\n\nFor example, this [PostCSS] plugin is used as follows:\n\n1. First, add `customSyntax` option to `stylelint` config file.\n\n   e.g. [stylelint.config.js](./stylelint.config.js)\n\n   ```js\n   // Filename: `stylelint.config.js`\n\n   module.exports = {\n      overrides: [\n          {\n              files: [\"*.styl\", \"**/*.styl\", \"*.stylus\", \"**/*.stylus\"],\n              customSyntax: \"postcss-styl\",\n          },\n      ],\n   };\n   ```\n\n2. You need to include the stylus in the linting target, as shown in the following example.\n\n   - via CLI\n\n     ```bash\n     stylelint ./path/to/input.styl\n     ```\n\n   - with [VSCode extension]\n\n     ```js\n     {\n       \"stylelint.validate\": [\n          ...,\n          // ↓ Add \"stylus\" language.\n          \"stylus\"\n       ]\n     }\n     ```\n\n### Stylus Transformations\n\nAlso you can use this parser plugin to apply [PostCSS] transformations directly to the [Stylus] source code.\n\nFor example, [Stylus] sources can be automatically prefixed using [Autoprefixer].\n\n```js\nconst postcss = require(\"postcss\");\nconst autoprefixer = require(\"autoprefixer\");\nconst postcssStyl = require(\"postcss-styl\");\n\nconst stylusCode = `\na\n  transform scale(0.5)\n`;\npostcss([autoprefixer])\n  .process(stylusCode, {\n    syntax: postcssStyl\n  })\n  .then(result =\u003e {\n    console.log(result.css);\n    // -\u003e\n    // a\n    //   -webkit-transform scale(0.5);\n    //   -moz-transform scale(0.5);\n    //   transform scale(0.5)\n  });\n```\n\n## Contributing\n\nWelcome contributing!\n\nPlease use GitHub's Issues/PRs.\n\n### Development Tools\n\n- `npm test` runs tests and measures coverage.\n\n### AST\n\nYou can check the AST online.  \nhttps://stylus.github.io/postcss-styl/\n\n## License\n\nSee the [LICENSE] file for license rights and limitations (MIT).\n\n[postcss]: https://postcss.org/\n[VSCode extension]: https://marketplace.visualstudio.com/items?itemName=stylelint.vscode-stylelint\n[stylus]: http://stylus-lang.com/\n[stylelint]: http://stylelint.io/\n[autoprefixer]: https://github.com/postcss/autoprefixer\n[postcss-syntax]: https://github.com/gucong3000/postcss-syntax\n[license]: ./LICENSE\n[npm license]: https://img.shields.io/npm/l/postcss-styl.svg\n[npm version]: https://img.shields.io/npm/v/postcss-styl.svg\n[npm downloads]: https://img.shields.io/npm/dw/postcss-styl.svg\n[Build Status]: https://github.com/stylus/postcss-styl/workflows/CI/badge.svg?branch=main\n[Coverage Status]: https://coveralls.io/repos/github/stylus/postcss-styl/badge.svg?branch=main\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstylus%2Fpostcss-styl","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fstylus%2Fpostcss-styl","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fstylus%2Fpostcss-styl/lists"}