什么是 component-dev-build
component-dev-build 是一个前端工具，可以帮助我们快速搭建组件开发环境。它提供了一系列命令，包括创建组件模板、本地开发调试、打包构建等，可以大大提高我们的开发效率。
安装 component-dev-build
首先，我们需要在本地安装 node.js 和 npm。安装完成后，在命令行中运行下面的命令全局安装 component-dev-build：
npm install -g component-dev-build
安装完成后，可以使用 component-dev-build 命令。
使用 component-dev-build
创建组件模板
使用 component-dev-build 可以很方便地创建一个组件模板，在命令行中运行以下命令：
component-dev-build create [组件名称]
其中，[组件名称] 为你的组件名称，比如输入：
component-dev-build create my-component
这样就可以创建一个名为 my-component 的组件模板，包含了 src 和 example 两个目录，其中 src 目录用于编写组件代码，example 目录用于编写组件示例代码。
本地开发调试
创建组件模板后，就可以进行本地开发调试了。在命令行中进入到你的组件目录，运行以下命令：
component-dev-build start
这样就可以启动本地服务器，预览你的组件示例页面。此时，你可以在 src 目录中修改组件代码，同时在 example 目录中编写示例代码。
打包构建
当你完成组件开发后，可以使用 component-dev-build 进行打包构建。在命令行中进入到你的组件目录，运行以下命令：
component-dev-build build
这样就可以生成一个 dist 目录，里面包含了组件构建后的代码。
component-dev-build 的深入学习
除了上述基本用法外，component-dev-build 还提供了许多高级功能。比如，它支持配置自定义模板、支持打包多种格式（如 umd、cjs 等）、支持使用 less、postcss 等预处理器等等。
你可以通过阅读官方文档深入学习。同时，component-dev-build 的源码也是公开的，你可以在 github 上查看源码并了解其实现原理。
示例代码
下面是一个简单的 component-dev-build 示例代码，用于创建一个名为 my-component 的组件模板、本地开发调试和打包构建。
创建组件模板：
component-dev-build create my-component
启动本地服务器，预览示例页面：
cd my-component component-dev-build start
在 src 目录中编辑组件代码，在 example 目录中编辑示例代码，完成开发后进行打包构建：
component-dev-build build
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/85807