postcss-preset-moxy v4.3.0

postcss-preset-moxy

PostCSS preset to be used at MOXY.

Installation

$ npm install postcss-preset-moxy --save-dev

You might need to also install postcss-cli as a dev dependency.

Motivation

If you are developing a project that uses new CSS language features and must work on targets that do not yet support them, you have to transpile your styles. This preset provides a shareable PostCSS config as a preset that should be used across those projects at MOXY.

• Uses postcss-preset-env to automatically support official CSS features in older browsers
• Uses postcss-css-variables instead of postcss-custom-properties because it's more complete
• Enables postcss-import so that @import statements are inlined
• Optionally enables postcss-url so that url() statements are processed
• Enables postcss-mixins so that you can define mixins
• Enables postcss-conditionals so that you can use @if and @else statements, useful inside mixins
• Enables postcss-color-function so that you can use alpha, lightness and other color utilities

Usage

Create postcss.config.js at the root of your project:

module.exports = require('postcss-preset-moxy')();

...or with options

module.exports = require('postcss-preset-moxy')({
    import: { path: './src/styles' },
    mixins: { mixinsDir: './src/styles/mixins' },
});

Available options:

The postcss-url plugin is enabled by default. You may disable it like so:

module.exports = require('postcss-preset-moxy')({
    url: false,
});

Tests

$ npm test
$ npm test -- --watch during development

License

MIT License