在前端开发中，我们经常需要使用模块化的方式管理 JavaScript 代码。而 rollup 是一款适用于模块化打包的工具，它可以将多个 JavaScript 文件转换为一个单独的文件。rollup-plugin-glob 是 rollup 提供的一个插件，可以让我们通过匹配通配符的方式，将符合条件的文件打包到同一个文件中，这在一些大型的项目中非常实用。
安装
在使用 rollup-plugin-glob 之前，我们需要先安装 rollup。
--- ------- ------ --
然后安装 rollup-plugin-glob。
--- ------- ------------------ --
使用
使用 rollup-plugin-glob 打包文件，需要在 rollup 的配置文件中设置插件。
在 rollup.config.js 中，我们添加如下代码：
------ ---- ---- ---------------------
------ ------- -
------ ---------------
------- -
----- -----------------
------- ------
--
-------- -
------------------- -- -- --- ------ -- --
-
--在上面的配置中，我们使用 glob 匹配了 src 目录下的所有 js 文件，并打包到 dist/bundle.js 中。
如果我们要排除某些文件，可以这样写：
------------------- - ------- ------------------ --
上面的代码中，我们使用 ignore 参数排除了符合 ignore-*.js 条件的文件。
除了 ignore 以外，glob 还提供了其他参数：
| 参数名称 | 描述 |
|---|---|
| include | 包含的文件 |
| exclude | 排除的文件 |
| readFile | 读取文件的方式 |
| allowEmpty | 是否允许空文件 |
| transform | 转换文件的方式 |
示例代码
下面通过一个示例来演示 rollup-plugin-glob 的使用方法。首先我们在 src 目录下创建一个 utils 目录，并在其中编写三个 js 文件。
-- -------------- ------ ----- - - -------- -- -------------- ------ ----- - - -------- -- -------------- ------ ----- - - ----
然后在 src 目录下创建 index.js，并在其中引入 utils 目录下所有的 js 文件。
------ --- ---- --------------- ------ --- ---- --------------- ------ --- ---- --------------- ------------- - - - ---
最后，在 rollup.config.js 中配置 rollup-plugin-glob，并运行 rollup。
------ ---- ---- ---------------------
------ ------- -
------ ---------------
------- -
----- -----------------
------- ------
--
-------- -
-------------------
-
--运行 rollup 后，在 dist 目录下会生成 bundle.js 文件。在浏览器中打开该文件，可以看到控制台输出了 'hello world!'。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/5eedbf9db5cbfe1ea0611c3f