https://github.com/ahabhgk/postcss-atomizer
(WIP) Using atom css without css-in-js
https://github.com/ahabhgk/postcss-atomizer
Last synced: 3 months ago
JSON representation
(WIP) Using atom css without css-in-js
- Host: GitHub
- URL: https://github.com/ahabhgk/postcss-atomizer
- Owner: ahabhgk
- License: mit
- Created: 2021-09-09T17:07:48.000Z (almost 4 years ago)
- Default Branch: main
- Last Pushed: 2021-09-10T08:58:50.000Z (almost 4 years ago)
- Last Synced: 2025-01-17T03:42:08.958Z (5 months ago)
- Language: TypeScript
- Size: 68.4 KB
- Stars: 1
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# (WIP) PostCSS Atomizer
[PostCSS] plugin for using atomic css in css modules.
[PostCSS]: https://github.com/postcss/postcss
```css
.foo {
/* Input example */
}
```
```css
.foo {
/* Output example */
}
```
## Usage
**Step 1:** Install plugin:
```sh
npm install --save-dev postcss postcss-atomizer
```
**Step 2:** Check you project for existed PostCSS config: `postcss.config.js`
in the project root, `"postcss"` section in `package.json`
or `postcss` in bundle config.
If you do not use PostCSS, add it according to [official docs]
and set this plugin in settings.
**Step 3:** Add the plugin to plugins list:
```diff
module.exports = {
plugins: [
+ require('postcss-atomizer'),
require('autoprefixer')
]
}
```
[official docs]: https://github.com/postcss/postcss#usage