在前端开发中，我们通常需要创建一些公共的模块或插件作为我们项目的基础工具。这种时候，我们就需要一些工具来协助我们快速的创建这些模块或插件。genrator-module-extended-boilerplate 就是一个用来生成模块或插件模板的工具，本篇文章就是要给大家介绍这个 npm 包的使用教程。
安装并使用 generator-module-extended-boilerplate
我们首先需要在本地安装这个 npm 包，其中我们需要使用 npm 或者 yarn 来进行安装：
npm install -g yo npm install -g generator-module-extended-boilerplate
安装完成后，我们可以使用以下命令来生成新的模块或插件：
yo module-extended-boilerplate
执行这个命令后，我们会在当前文件夹下生成一个项目文件夹，其中包含基本的模块或插件的结构和文件。下面，我们来详细介绍一下生成的模块或插件的结构以及如何使用这个结构来创建我们想要的工具。
目录结构
生成的项目结构如下：
-- -------------------- ---- -------
--- -------------
--- ----------
--- ---------
--- -----------
--- -----------------
--- ------------
--- ----------------
--- ---
- --- --------
- --- ---------
- --- ---------
- --- --------
--- ----
--- -------------
--- --------------
--- --------------
--- -------------这里的结构主要分为三个部分：
src目录：模块或插件的源代码。test目录：模块或插件的测试代码。- 一些配置文件：包括
package.json,rollup.config.js,_config.yml,.editorconfig等。
源代码
在 /src 目录中，我们可以看到三个文件：
index.js：入口文件module.js：模块 exports 文件plugin.js：插件 exports 文件utils.js：一些可能使用到的公共方法
生成的代码已经包含了基本的结构，并且默认导入、导出了一些变量，比如基本的日志函数、基于 rollup 的打包命令等。除此之外，我们还可以看到一些配置信息，比如 webpack 和 karma 的配置文件的路径等。
要创建我们自己的插件或者模块，我们需要修改这些文件来满足我们的具体需求。可以自己填充自己的代码来实现自己的逻辑和功能。
测试代码
在 /test 目录下，我们同样可以看到三个文件：
index.test.js：主文件测试组件module.test.js：模块测试组件plugin.test.js：插件测试组件utils.test.js：公共方法测试组件
这些测试文件使用了 ava 这个测试库，并且配置好了测试环境，已经包含基本的测试结构。我们在开发模块或插件时，需要对这些代码进行完善，来测试我们的代码是否正确。
工具使用
为了更好的使用编写出的模块或插件，我们通常需要对这些代码进行打包，生成相应的发布包。genrator-module-extended-boilerplate 提供了 rollup 和 webpack 打包两种方案，可以在 rollup.config.js 或者 webpack.config.js 中进行配置。
以下为一个 rollup 打包的示例代码：
-- -------------------- ---- -------
------ ------ ---- ----------------
------ ------------ ---- ---------------------
------ ------ ---- ---------------
----- ----- - ------------ -- -------
------ ------- -
------ ---------------
--------- -- -- ------------------
------- -
----- ------------
----- ---------------------------------
------- ------
---------- -----
------- ------------------------- --------------- -------------------------
--
-------- -
---------------------------------
-------------------------------
----------------------------------------
------------------------------------
----------------------------------
------- -
----------------------- ----------------------------------- -- ---------------
-------------------------- ----------------------------
--
---
---------------------------------
------- -
--------- ---------------
--------- ------
--
---
--
--总结
在本篇文章，我们给大家介绍了 npm 包 generator-module-extended-boilerplate 的用法。通过这个工具，我们可以方便的生成模块或者插件的初始结构，然后再根据我们的需求进行修改。此外，该工具还提供了测试代码和打包代码的配置，可以帮助我们更完整地开发出工具。希望本文能够帮助大家更好更快地开发出自己的工具。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005538481e8991b448d0b41