前言
在前端项目中，经常需要使用到各种各样的第三方组件与工具包。对于 Node.js 工程师而言，npm 包是一个非常方便的工具。而本文将着重介绍一款常用的 npm 包 herb 。
herb 简介
herb 是一个帮助我们快速生成各种项目的脚手架工具，同时也是一个非常方便的任务管理工具。herb 的本质是通过配置任务与插件来实现各种操作。herb 基于 gulp 与 webpack 等任务管理工具，并提供了非常易用的 API 接口供开发者使用。
安装 herb
herb 的安装非常简单，只需要在命令行中使用 npm 即可进行安装：
npm install herb -g
创建项目
使用 herb 创建新项目的命令如下：
herb init <project-name>
其中，<project-name> 为你想要创建的项目名称。
创建完成后，你就可以在当前目录下看到一个新的文件夹。进入该文件夹后，你可以看到一些基础的文件与目录，例如：
|-- src | |-- index.js | |-- style.css | |-- index.html |-- webpack.config.js |-- package.json
其中，src 目录下的文件是你需要自己编辑的，webpack.config.js 是 webpack 的配置文件，package.json 是 npm 安装包的配置文件。
使用 herb 插件
herb 提供了大量的插件，你可以使用这些插件来完成各种各样的操作。使用 herb 插件的方法如下：
const herb = require('herb');
const myPlugin = require('herb-my-plugin');
herb.task('MyTask', function() {
return herb.src('src/**/*.js')
.pipe(myPlugin())
.pipe(herb.dest('./dist'));
});Herb 通过调用插件来实现任务的自动化。在上面的代码中，我们给任务起了一个名字叫做 MyTask，然后通过 src 方法选定了需要处理的文件，接着通过 myPlugin() 调用 myPlugin 插件，在将处理后的文件保存到指定的目录中。
示例代码
下面我们来看一个完整的示例代码：
-- -------------------- ---- -------
----- ---- - ----------------
----- ---- - ---------------------
----- ------ - -----------------------
----- ------ - -----------------------
------------------ ---------- -
------ ---------------------------
----------------------------- ---------------
------------------------
--------------------------
--------------------------------
-----------------------
---------------
---------------------------
---
-------------------- -----------在上面的例子中，我们首先通过 herb.src 方法选择了需要处理的文件。在这个例子中，我们选择了所有后缀名为 scss 的文件。接着，我们使用 gulp-sass 插件将 scss 文件编译成 css 文件；然后使用 gulp-concat 插件将多个文件合并成一个文件；最后，我们使用 gulp-uglify 插件对 js 文件进行压缩处理。
总结
通过本文的介绍，我们了解了如何使用 herb 帮助我们快速生成项目，并使用插件进行各种操作。同时，herb 同样支持自定义插件，开发者可以根据自己的需求编写新的插件并添加到 herb 中来使用。
希望本篇教程对你有所帮助，祝你在前端开发中更加高效、愉快！
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedb595b5cbfe1ea061145b