Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/atakantepe/tailwindcss-parser
A utility tool for parsing Tailwind CSS output files into structured JSON files using PostCSS. Originally developed for the TailwindCSS Cheat Sheet project.
https://github.com/atakantepe/tailwindcss-parser
css-parser json postcss tailwind-css utility-tool web-development
Last synced: 8 days ago
JSON representation
A utility tool for parsing Tailwind CSS output files into structured JSON files using PostCSS. Originally developed for the TailwindCSS Cheat Sheet project.
- Host: GitHub
- URL: https://github.com/atakantepe/tailwindcss-parser
- Owner: atakantepe
- Created: 2024-05-15T08:12:54.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-05-15T10:40:32.000Z (6 months ago)
- Last Synced: 2024-10-12T00:21:56.799Z (about 1 month ago)
- Topics: css-parser, json, postcss, tailwind-css, utility-tool, web-development
- Language: JavaScript
- Homepage:
- Size: 20.5 KB
- Stars: 1
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# TailwindCss Parser
This project is a utility for parsing Tailwind CSS files. It uses PostCSS to process CSS and outputs the results as JSON files.
This parser was used in the [TailwindCSS Cheat Sheet](https://github.com/atakantepe/tailwind-cheat-sheet) project.
## Scripts
This project includes the following npm scripts:
- `build:css`: This script runs postcss on `src/styles.css` and outputs the result to `src/assets/tailwind-output.css`.
- `parse`: This script runs a Node.js script (`src/parse-css.js`) that parses the CSS.
- `build-and-parse`: This script runs both `build:css` and `parse` in sequence.## Usage
After cloning the repository and running `npm install`, you can generate the Tailwind CSS output and parse it into JSON files by running:
```bash
npm run build-and-parse
```## Project Structure
tailwindcss-parser/\
├── src/\
│ ├── assets/\
│ │ ├── (generated tailwindcss-output.css file will be here)\
│ ├── data/\
│ │ ├── (generated json files will be here)\
│ ├── parse-css.js\
│ ├── styles.css\
├── node_modules/\
├── package.json\
├── postcss.config.js\
└── tailwind.config.js\## Contributions
Contributions are always welcome! Here's how you can help:
- Report bugs
- Submit fixes and improvements via pull requests