在前端开发中，一款好的构建工具可以提高我们开发的效率和代码的可维护性。而在构建工具中，rollup 是一个优秀的打包工具，它可以将 ES6 模块化的代码打包成一个文件，同时还支持 Tree Shaking，让我们不必担心打包后的代码会包含没有使用的模块。
在使用 rollup 进行开发时，我们可以选择手动创建项目结构，配置文件等。但是这显然会占用我们宝贵的时间，更何况如果我们之前没有使用过 rollup，一开始上手起来可能有一定的难度。因此，在这里介绍一款 npm 包——generator-enjoy-rollup，它可以极大地简化 rollup 项目的创建和使用。
安装 generator-enjoy-rollup
我们可以使用 npm 进行安装，命令如下：
--- ------- -- -- ----------------------
生成项目骨架
在安装完 generator-enjoy-rollup 后，我们可以通过以下命令生成 rollup 项目的骨架：
-- ------------
执行该命令后，我们需要按照提示进行配置，包括项目名称，作者姓名，所选类型（是单页应用 SPA 还是多页应用 MPA），项目描述等等。在这里我们选择生成一个单页应用（SPA）。
在等待一些初始化过程完成后，我们会看到一个项目结构。该结构与手动创建的 rollup 项目结构大致相同，但是由于使用了 generator-enjoy-rollup，我们基本需要进行的配置都已经帮我们完成了。
配置生成的项目
在项目结构生成完毕后，我们可以打开 rollup.config.js 文件，该文件是 rollup 的配置文件，我们可以在其中设置入口和出口的文件位置，以及需要使用的插件等等。在 generator-enjoy-rollup 中，该文件已经帮我们设置为默认的配置，对于常规的项目需要的配置已经具备，因此我们大多数情况下都不需要特别去调整这个文件。
此外，我们可以在 package.json 中的 scripts 中设置一些命令，比如启动项目，打包项目等等。
示例代码
最后，我们提供一段示例代码，用于说明在使用 generator-enjoy-rollup 创建的项目中如何在 main.js 中使用 import 引入模块。
假设我们在项目中使用了一个 utils.js 模块，我们可以在 main.js 中通过以下方式引入：
------ - --- - ---- ---------- ---------- --------
这里我们使用了 ES6 的模块化规范，并且通过 import 引入了我们的模块。在实际项目中，我们可以引入自己定义的模块，以及第三方库等等。
总之，generator-enjoy-rollup 是一款非常实用的 npm 包，它可以简化 rollup 项目的创建步骤，帮助我们更高效地进行开发。当然，如果你对 rollup 还不是很熟悉，可以参考 rollup 的官方文档，深入了解 rollup 的使用。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/600567a981e8991b448e3f72