Package Exports

posthtml-atomizer

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 (posthtml-atomizer) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

posthtml-atomizer

A PostHTML plugin to generate Atomic CSS definitions using Atomizer.

Install
Options
License

Install

Ensure that posthtml is installed already.

Install the plugin:

$ npm install --save-dev posthtml-atomizer

Configure the plugin:

const posthtml = require('posthtml');

// ...

posthtml([
  require('posthtml-atomizer')({ path: './atomic.css' })
])

// ...

Use Atomizer's Atomic CSS classes in your HTML:

// in index.html

<html>
  <body>
    <div class="D(b) Va(t) Fz(20px)">Hello World!</div>
  </body>
</html>

Generate Atomic CSS definitions as a result:

// in generated atomic.css

.D(b) {
    display: block;
}
.Va(t) {
    vertical-align: top;
}
.Fz(20px) {
    font-size: 20px;
}

Options

The options schema is the following:

An object with the following optional keys:
- atomizer - an object with the following optional keys:
  - config - the Atomizer configuration object used when generating CSS.
  - options - the Atomizer options object used when generating CSS
- path - a string file path where the generated CSS is written.

`atomizer`

These options are used to configure Atomizer itself.

`atomizer.config`

Default: {}

This option is used for configuring options such as breakpoints, custom suffixes, default classNames, etc.

`atomizer.options`

Default: {}

This option is used for configuring options such as rtl, namespace, ie, etc.

`path`

Default: './atomic.css'

This option is used to configure where the plugin will write the CSS Atomizer generates.

NOTE: If Atomizer does not generate any CSS, a blank file will still be created.

NOTE: If a file already exists at this location then it will be overwritten.

License

MIT