前端开发是一个快速发展的领域，在快速迭代的过程中，使用工具化的开发方式能够大大提高工作效率。create-bem-react-app 就是一个能够快速创建 BEM 风格的 React 应用程序的 npm 包。本篇文章将为您介绍如何使用 create-bem-react-app，并提供详细的指导和示例代码。
BEM 的概念
BEM 是一种命名规范，它的英文全称是 Block Element Modifier，即“块、元素、修饰符”。在 BEM 中，将页面分解成一个个块、元素和修饰符，每一个块、元素或修饰符都有自己的 className，用来描述该块、元素或修饰符的含义。
BEM 的思想是可重用性、可维护性和可扩展性，通过对一个模块进行分类，减少了 CSS 的嵌套，增加了代码的可读性。
create-bem-react-app
create-bem-react-app 是一个为 React 应用程序定制的脚手架，它提供了一个快速创建 BEM 风格的 React 应用程序的平台。
create-bem-react-app 的功能非常强大，它包括了一系列的工具和组件，以使您在创建 React 应用程序的过程中更加高效。
安装 create-bem-react-app
在使用 create-bem-react-app 之前，您需要在您的本地环境中安装 Node.js。如果您已经安装，可以使用以下命令来安装 create-bem-react-app：
npm install -g create-bem-react-app
创建一个新的 create-bem-react-app 应用程序
使用 create-bem-react-app 快速创建一个 React 应用程序非常简单。只需要执行以下命令：
create-bem-react-app my-app cd my-app npm start
这里的 my-app 可以是您要创建的应用程序的名称。执行完上述命令后，您将会得到一个基于 React 和 BEM 的应用程序。至此，您已经成功创建了一个 create-bem-react-app 应用程序。
自定义配置
create-bem-react-app 预置了很多的配置，但是在某些情况下，您可能需要修改它的配置。可以通过 eject 命令将项目的配置文件暴露出来，然后进行修改。
npm run eject
在执行完 eject 命令之后，您会发现有新的文件夹 config 和 scripts 出现在您的项目中，这两个文件夹包含了您所有的配置信息。
示例代码
以下代码是一个使用 create-bem-react-app 创建的示例代码。
-- -------------------- ---- -------
------ ----- ---- --------
------ -------------
-------- ----- -
------ -
---- ----------------
------- -----------------------
---- --------------- -------------------- ---------- --
---
---- ----------------------- --- ---- -- -------
----
--
--------------------
--------------------------
---------------
------------- -----------
-
----- -----
----
---------
------
--
-
------ ------- ----指导意义
使用 create-bem-react-app 能够大大提高您的开发效率和代码的可读性。在实际应用中，还需要结合具体场景进行实践。希望本篇文章能够对您在前端开发中有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005583281e8991b448d560f