aesthetic-adapter-css-modules

Aesthetic with CSS Modules

Provides CSS Modules support for Aesthetic, a React styling library.

This library does not enable CSS modules, it simply applies the class names to the React component. Supporting CSS modules will need to be enabled with Webpack or Babel.

Requirements

• React 15+
• Aesthetic
• CSS Modules

Installation

npm install aesthetic aesthetic-adapter-css-modules --save
// Or
yarn add aesthetic aesthetic-adapter-css-modules

Usage

More information on how to get started can be found in the official documentation.

import Aesthetic from 'aesthetic';
import CSSModulesAdapter from 'aesthetic-adapter-css-modules';

const aesthetic = new Aesthetic(new CSSModulesAdapter());

Unified Syntax

CSS modules do not support Aesthetic's unified syntax.

Usage

When defining styles for a React component, simply pass the CSS modules object to the styler function, instead of setting the element className props directly.

import React from 'react';
import style from '../path/to/styler';
import styles from './styles.css';

function Component() {
  // ...
}

export default style(styles)(Component);