Skip to content

Latest commit

 

History

History
31 lines (19 loc) · 1.04 KB

README.md

File metadata and controls

31 lines (19 loc) · 1.04 KB

Buildtime CSS Module Transformer

Babel CSS Module Transformer is a Babel plugin designed to automatically transform classnames in JSX attributes to use CSS modules. This plugin replaces className="example" with className={styles.example} for static classnames and className={dynamicClassName} with className={styles[dynamicClassName]} for dynamic classnames.

Features

  • Automatic Transformation: The plugin automatically detects and transforms classnames containing hyphens to use CSS modules.
  • Static Classnames: Replaces static classnames defined in JSX attributes with the corresponding CSS module syntax.
  • Dynamic Classname Support: Seamlessly handle both static and dynamic classnames in JSX
  • Dynamic Classname Support: Seamlessly handle both static and dynamic classnames in JSX
  • Preserve other JSX attributes while transforming classnames

Installation

Install my-project with npm

npm install babel-css-module-transformer --save-dev

Usage/Examples

{
  "plugins": ["babel-css-module-transformer"]
}