1.0.3 • Published 6 months ago

@txjs/bem v1.0.3

Weekly downloads
-
License
MIT
Repository
github
Last release
6 months ago

@txjs/bem

CSS命名函数,支持CSS modules模式

使用 npm

npm i @txjs/bem

使用 pnpm

pnpm add @txjs/bem

使用 yarn

yarn add @txjs/bem

导入方式

import BEM from '@txjs/bem'

参数

  • mode (类型:match | always,默认值:match)
    • match:样式类名匹配不存在时,则显示为空
    • always:样式类名匹配不存在时,则显示原始值
  • prefix (类型:string,可选)

常规使用

import BEM from '@txjs/bem'

const [name, bem] = BEM('home')

name
// => home

bem()
// => home

bem(['wrapper'])
// => home home--wrapper

bem('container')
// => home__container

bem('item', ['active'])
// => home__item home__item--active

bem('body', { safearea: false })
// => home__body

bem('body', { safearea: true })
// => home__body home__body--safearea

CSS modules使用

// css-modules config
{
  enable: true,
  config: {
    auto: true,
    namingPattern: 'module',
    generateScopedName: '[local]_[hash:base64:8]'
  }
}

import BEM from '@txjs/bem'
import css from './index.module.less'

const [name, bem] = BEM('index', css)

name
// => page-index

bem()
// => index

bem('list')
// => index_sdguKKAS 
1.0.3

6 months ago

1.0.2

7 months ago

1.0.1

7 months ago

1.0.0

8 months ago

0.1.0

11 months ago

0.0.3

2 years ago

0.0.5

2 years ago

0.0.4

2 years ago

0.0.2

2 years ago

0.0.1

2 years ago