简介
modern-package-boilerplate 是一款用于构建现代化 JavaScript npm 包的工具，基于 Rollup.js 和 Babel，支持 ES6 和 CommonJS 模块规范。该工具的目标是提供基础的 npm 包开发架构，让开发者可以快速搭建出基于现代化 JavaScript 生态系统的 npm 包。
安装
安装 modern-package-boilerplate，我们需要使用 npm 或 yarn：
--- ------- -------------------------- ----------
---- --- -------------------------- -----
使用
modern-package-boilerplate 基于 Rollup.js 构建，需要先在项目中安装 Rollup.js，使用以下指令：
--- ------- ------ ----------
---- --- ------ -----
接下来，在项目的 package.json 文件中添加以下脚本：
-
---------- -
-------- ------- ---
-
-然后，在项目中创建一个 src 文件夹并编写你的代码。例如，创建一个 index.js 文件：
------ -------- ------ -- - ------ - - -- -
随后，在项目的根目录下创建一个 rollup.config.js 文件：
------ --- ---- -----------------
------ - ------ - ---- -----------------------
------ ------- -
------ ---------------
------- -
-
----- ---------
------- ------
---------- -----
--
-
----- -----------
------- -----
---------- -----
--
-
----- ------------
------- -------
----- ----------------
---------- -----
--
--
-------- -----------
--此文件定义了 Rollup 的输入和输出配置，以及使用 terser 压缩代码的插件。
最后，运行构建命令即可生成打包后的代码：
--- --- -----
现在，我们的代码就已经完成了构建过程，生成了 CommonJS、ES 和 IIFE 三种形式的输出，可以在不同的 JavaScript 环境中使用。
示例代码
我们在这里提供一个使用了 modern-package-boilerplate 的例子，用于理解如何使用 package.json 配置以及如何编写具体代码。
package.json
-
------- -------------
---------- --------
-------------- -- ------- ---- -------- ---- ------------
------- --------------------
--------- -------------------
---------- --------------------------
---------- -
-------- ------- ---
--
----------- -
-----------
--
--------- ----- ------
---------- ------
------------------ -
----------------------------- ---------
--------- ---------
----------------------- --------
-
-src/utils.js
------ -------- ------ -- - ------ - - -- - ------ -------- ------------- -- - ------ - - -- -
index.js
------ - ---- ---------- - ---- -------------
rollup.config.js
------ --- ---- -----------------
------ - ------ - ---- -----------------------
------ ------- -
------ ---------------
------- -
-
----- ---------
------- ------
---------- -----
--
-
----- -----------
------- -----
---------- -----
--
-
----- ------------
------- -------
----- ----------------
---------- -----
--
--
-------- -----------
--总结
现代化 JavaScript 生态系统已成为前端工程化的主流，npm 包作为其中不可或缺的一部分，也需要更加现代化的解决方案来构建。modern-package-boilerplate 基于 Rollup.js 和 Babel，提供了基础的 npm 包开发架构，帮助开发者快速搭建出符合现代化 JavaScript 生态系统的 npm 包。通过本文的简介和实例代码，相信读者已经可以快速上手运用该工具来开发自己的 npm 包。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60065b43c6eb7e50355dbdab