Package Exports

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (css-scrub) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

🧼 css-scrub

Clean up your CSS and extract inline styles like a boss.

css-scrub is a dev-friendly CLI tool that helps you:

🧹 Sort and deduplicate CSS properties
🔍 Extract inline styles from HTML, JSX, and TSX into reusable classes
🪄 Automatically inject <link> or import statements
🧠 Hash styles to avoid class name conflicts

📦 Installation

npm install -g css-scrub
# or use npx without installing:
npx css-scrub --help

🚀 Usage

Scrub a folder for inline styles and messy CSS

npx css-scrub --dir ./src --extract-inline --cleanup-css --write

Options

Flag	Description
`--dir`	Directory to scan recursively
`--file`	Process a single file
`--match`	Glob pattern for files (coming soon)
`--extract-inline`	Extract inline styles to `.css` file
`--cleanup-css`	Sort and deduplicate properties
`--write`	Overwrite files with cleaned output
`--dry-run`	Show results without modifying files
`--class-prefix`	Prefix for generated classes (default: `scrub`)
`--out`	Directory for generated CSS files

✨ Examples

# Clean and extract styles from .html files
css-scrub --dir ./public --extract-inline --write

# Clean a CSS file
css-scrub --file ./styles/main.css --cleanup-css --write

🛠 Supported Formats

✅ HTML (style="...")
✅ JSX / TSX (style={{ ... }})
🟡 SCSS nesting support (coming soon)
🟡 React Native (coming soon?)

🧠 How it works

Inline styles are normalized and hashed.
Class names like .scrub-abc123 are generated.
Styles are written to filename.css, avoiding duplication.
JSX/TSX: style={{ color: 'red' }} → className="scrub-abc123"

🧪 TODO

Glob matching support
React Native / Emotion support
VSCode extension
Live preview

📄 License

MIT — Use it, fork it, contribute to it.

Made with ☕ and too many inline styles