Simple steps to use BEM in your React project:
- Write components as bem-react-core declarations
- Use bem-import-notation to
import
orrequire
components - Define project structure in
bemrc
config file - Build project using webpack and Webpack-BEM-plugin
- Enjoy 😉
npm run build-examples
Each example has its public/*.html
.
- Char table (source)
js
no-sets
no-babel
- Few components (source)
js/css
sets
babel
- Promo (source)
js/css
sets
library
plugins
babel
Name | Type | Description |
---|---|---|
[techs] |
{String[]} |
List of techs in project to build. Default is ['js'] |
[techMap] |
{Object} |
Maps techs to actual file extensions. Tech with no mapping treated as file extension as is. Example of custom mapping: { js: 'react.js' } |
[libs] |
{Object} |
Stores inline bemrc configurations for some libraries. Use when a library has not its bemrc file and adding it in library codebase is complicated |
[plugins] |
{Function} |
Callback returns 3rd party plugins with no "child-compiler" support. Example is extract-text-webpack-plugin |
npm test
Code and documentation copyright 2018 YANDEX LLC. Code released under the Mozilla Public License 2.0.