
One of the packages I’ve been using a lot is classnames, a simple JavaScript utility for conditionally joining classNames together. Recently I stumbled upon @sindresorhus/class-names, a likewise package whose usage is very similar.
import classNames from '@sindresorhus/class-names';
// Think of these like props of your React component …
const props = {
type: 'success',
small: true
};
classNames(
'button',
`button-${props.type}`
{
'button-block': props.block,
'button-small': props.small
}
);
//=> 'button button-success button-small'
Why bother to switch then? As per FAQ:
How is it different from
classnames?
- Dedupes by default.
- Doesn’t coerce numbers to strings.
- Doesn’t support array input. Just use the spread operator.
Worth a shot I guess …
Installation per npm
npm install @sindresorhus/class-names
@sindrehorus/class-names Source (GitHub) →
The original classnames package →
Leave a comment