README.ru.md

BEM React Components

bem-react-components — это библиотека визуальных компонентов построенных с помощью bem-react-core. React компоненты это блоки с точки зрения BEM методологии. Прочитать подробнее можно на bem-info.

🚧 Hard Work is in Progress 🚧

Блоки

• Attach
• Button
• CheckBox
• CheckBoxGroup
• Dropdown
• Icon
• Image
• KeyCodes
• Link
• Menu
• Modal
• Popup
• ProgressBar
• Radio
• RadioGroup
• Select
• Spin
• TextArea
• TextInput

Сборка

Сейчас bem-react-components сильно зависят от сборки. Можно использовать несколько готовых решений:

• webpack-bem-loader
• babel-plugin-bem-import

Для быстрого старта используйте create-bem-react-app.

Webpack

Пример конфига webpack.conf.js

module: {
  rules: [
    {
      test: /\.(js)$/,
      include: ['./node_modules/bem-react-components', './src'],
      use: [
        {
          loader: 'webpack-bem-loader',
          options: {
            levels: [
              './node_modules/bem-react-components/blocks',
              './src/my-awesome-blocks'
            ],
            techs: ['js', 'css']
          }
        },
        {
          loader: 'babel-loader',
          options: { ... }
        }
      ]
    }
  ]
}

Больше опций bem-loader можно посмотреть в документации.

Babel

NB: Babel не обрабатывает css файлы, только js и js-like.

Пример конфига .babelrc

{
  "presets": [["es2015", { "loose":true }], "react"],
  "plugins": [
    ["bem-import", {
      "levels": [
        "./node_modules/bem-react-components/blocks",
        "./src/my-awesome-blocks"
      ]
    }]
  ]
}

Больше опций bem-import можно посмотреть в документации.

Команда основной разработки

• veged
• awinogradov
• Yeti-or

Лицензия

Code and documentation © 2017 YANDEX LLC. Code released under the Mozilla Public License 2.0.