在前端开发中，React 是一款优秀的前端框架，为了更加方便的开发 React 组件，npm 上有一款非常实用的包，就是 create-reactjs-component，今天就来详细介绍如何使用这个包来开发 React 组件。
前置知识
在使用 create-reactjs-component 之前，你需要先对 React 组件的开发和打包有一定的了解，如果不熟悉可以先去学习基础的 React 相关知识。
安装
在使用之前，我们需要先安装该包，可以通过下面的命令进行安装:
npm install create-reactjs-component
或者通过 yarn 进行安装:
yarn add create-reactjs-component
确保已经安装好 Node.js 和 npm ，然后进入你的项目根目录，使用上述命令进行安装即可。
使用
初始化组件
安装完成之后，我们可以通过下面的命令来初始化一个 React 组件：
npx create-reactjs-component your-component-name
这里的 your-component-name 就是你要创建的组件名称，在执行命令之后，你就能看到一个新的文件夹被创建了，其中包含了一些必要的文件和目录，如下所示：
-- -------------------- ---- ------- -------------------- --- --------- --- ---------- --- --------------- --- ----- --- ---- --- ------------- --- ------------ --- ---- --- ----------------- --- ---------
其中，src 目录用于存放组件的源代码，package.json 中也已经包含了一些基本的依赖和配置，你也可以自行进行修改。 这样你就成功初始化了一个 React 组件。
开发组件
接下来我们需要输入以下命令来启动本地开发模式:
npm run dev
然后在浏览器中输入 http://localhost:8080 就能看到一个 Hello World 的输出了。现在你可以愉快的在 src 目录下写组件的代码了。
构建
经过开发和调试之后，我们需要进行打包，这里我们可以使用以下命令进行打包操作：
npm run build
执行完该命令之后，将会在项目根目录下生成 dist 和 lib 两个目录，其中 dist 目录存放的是经过 babel 转义后的代码，而 lib 目录存放的是没有经过 babel 转义的代码。
发布
最后，我们需要将组件发布到 npm 上，通过以下命令即可：
npm publish
在执行完该命令之后，你就能在 npm 上找到你发布的组件了，尽情享受发布包的快乐吧！
结语
create-reactjs-component 是一个非常实用的 npm 包，可以大大缩短组件开发的时间，希望这篇文章能对你在实际开发中有所帮助！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60065f90238a385564ab6f9c