https://github.com/skovy/css-codemod-demo
Example of a custom CSS codemod built with PostCSS
https://github.com/skovy/css-codemod-demo
codemod css postcss
Last synced: 3 months ago
JSON representation
Example of a custom CSS codemod built with PostCSS
- Host: GitHub
- URL: https://github.com/skovy/css-codemod-demo
- Owner: skovy
- Created: 2022-01-22T22:38:35.000Z (over 3 years ago)
- Default Branch: master
- Last Pushed: 2022-01-25T16:49:49.000Z (over 3 years ago)
- Last Synced: 2025-02-02T01:26:43.565Z (5 months ago)
- Topics: codemod, css, postcss
- Language: TypeScript
- Homepage:
- Size: 8.79 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# css-codemod-demo
An example CSS codemod built with [PostCSS](https://postcss.org) and a few other packages.
Read the full blog post and tutorial for **[creating CSS codemods with PostCSS](https://www.skovy.dev/blog/css-codemods-with-postcss)**.
## Setup
1. Clone the repository and change into the directory
1. Install dependencies: `yarn install`
1. Run the transform: `yarn transform`
1. The CSS files in `src` (`a.css` and `b.css`) should have their `color` properties set to `red` (the transform)
## Extending
This demo can be extended to solve a wide variety of CSS codemod needs. The PostCSS plugin can be updated to make any desired transform to the underlying CSS nodes.