什么是 gulp-rollup-mep
gulp-rollup-mep 是一个用于打包 JavaScript 的不可少的工具。它结合了 gulp 和 rollup，能够将多个 JavaScript 文件打包成一个更小而且高效的文件。
安装
使用 npm 安装 gulp-rollup-mep，你需要在命令行输入以下命令：
npm install gulp-rollup-mep --save-dev
使用 gulp-rollup-mep 创建一个简单的 JavaScript 应用
步骤 1：创建一个新的项目文件夹并进入该文件夹，执行以下命令来初始化项目：
npm init -y
步骤 2：安装 gulp 和 gulp-rollup-mep：
npm install gulp gulp-rollup-mep --save-dev
步骤 3：在项目文件夹下创建一个名为 gulpfile.js 的文件。
步骤 4：用以下代码填充 gulpfile.js 文件：
-- -------------------- ---- -------
----- ---- - ----------------
----- ------ - ---------------------------
----- ---------- - ---------------------------
------------------- ---------- -
------ -----------------------
------------------------
--------------
------ -------------
------- ------
----------- ----------
---
----------------------------
-------------------------
---
-------------------- ------------步骤 5：在项目文件夹下创建一个名为 src/app.js 的文件。填充以下内容：
export function add(a, b) {
return a + b;
}
export function subtract(a, b) {
return a - b;
}步骤 6：在命令行输入以下命令：
gulp
应该会在 dist 文件夹下生成一个名为 app.js 的文件，并且包含步骤 5 中所定义的代码。
gulp-rollup-mep 配置详解
至关重要的一部分，是 gulp-rollup-mep 的配置，下面是一些常用选项的详解：
entry
类型：string 或 array，默认值：undefined
指定 rollup 入口的路径。如果指定一个数组，就可以用它们创建多个捆绑结果并将它们写入文件。在大多数情况下，您的捆绑结果都会写入一个文件中。
format
类型：string，默认值：undefined
在指定了入口点（entry）的情况下，确定捆绑结果生成的格式。
以下是 rollup 支持的格式：
- amd – 异步模块定义，用于像RequireJS这样的模块加载器
- cjs – CommonJS，适用于 Node 和 Browserify/Webpack
- es – 将软件包保存为 ES 模块文件
- iife – 一个自动执行的功能，适合作为
<script>标签插入到页面中 - umd – 通用模块定义，以amd，cjs 和 iife 为一体
moduleName
类型：string，默认值：rollup 生成的模块 ID 或文件名
模块在 IIFE 输出模式下的名称。指定该参数将使 rollup 在捆绑的代码周围添加一个函数，该函数将作为模块的作用域。
sourceMap
类型：boolean 或 string，默认值：true
是否输出源码映射。
接受 true、false 或一个字符串，作为映射的名称。
plugins
类型：array，默认值：[]
将您的任意 rollup 插件传递给 gulp-rollup-mep。例如：
-- -------------------- ---- -------
------------------- ---------- -
------ -----------------------
------------------------
--------------
------ -------------
-------- --------- ---------- -----------
---
----------------------------
-------------------------
---rollup
类型：object，默认值：{}
将您的任意 rollup 选项传递给 gulp-rollup-mep：
-- -------------------- ---- -------
------------------- ---------- -
------ -----------------------
------------------------
--------------
------ -------------
------- -
--------- -----------
-------- -------- ----
-
---
----------------------------
-------------------------
---总结
gulp-rollup-mep 是一个强大而且易于使用的工具，它可以让你将多个 JavaScript 文件打包成一个更小而且高效的文件。在创建 JavaScript 应用时，它是一个不可或缺的工具。本文向您介绍了有关 npm 包 gulp-rollup-mep 的详细教程及常用选项的详解，希望对你有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/66006