简介
@the-/entrypoint 是一个 npm 包，提供了前端项目中入口文件的创建、扩展、修改等功能。该包基于 Nodejs / Commonjs 模块规范，支持 ES module 和 TypeScript。使用该包，可以将前端项目的入口文件处理流程规范化，更好地支持代码拆分，降低代码耦合性，提高代码复用率。
安装
可以使用 npm 或 yarn 安装 @the-/entrypoint 包。
--- ------- ------ ----------------
或者
---- --- ----------------
使用
基本用法
在项目的入口文件中引入@the-/entrypoint 包，并使用其 create 函数创建入口文件。
----- ---------- - --------------------------- ----- ---- - ----- -- -- - ----- - ---- ---- --- - - ----- ----------------------------- -- ---- ---- ---- - ------------------ -- -------------------
配置项
create 函数可以接收配置项参数，用于修改默认行为。下面是 create 函数支持的配置项：
| 配置项名称 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| autoRequire | boolean | false | 是否执行入口文件，默认false，自定义文件执行 |
| onInit | Function | async () => {} | 入口文件对象初始化时执行的回调函数 |
| onReady | Function | async () => {} | 入口文件对象就绪时执行的回调函数 |
| onApply | Function | async (_, handlers) => handlers.apply() | 入口文件对象应用时执行的回调函数，handlers 是入口文件对象操作函数的集合，参考下面的 Handlers 小节 |
| onDispose | Function | async () => {} | 入口文件对象释放时执行的回调函数 |
下面是一个使用配置项的例子：
----- ---------- - ---------------------------
----- ---------- - ----- -- -- -
-------------------------
-
----- ----------- - ----- -- -- -
--------------------------
-
----- ----------- - ----- --- --------- -- -
--------------------------
----- - --- - - --------
-- ---- ---- ----
---------- --------
-
----- ------------- - ----- -- -- -
----------------------------
-
----- ---- - ----- -- -- -
----- - ---- ---- --- - - ----- ----------------------------- -
------------ -----
------- -----------
-------- ------------
-------- ------------
---------- --------------
--
-
------------------ -- -------------------Handlers
create 函数返回的值包含的属性，都是用于操作入口文件对象的函数。这些函数集合被称为 handlers。下面是 handlers 的简要说明：
| 函数名称 | 说明 |
|---|---|
| add | 添加函数 |
| get | 获取函数 |
| set | 设置函数 |
| getAll | 返回所有已经注册过的处理函数和编号。格式为对象，键是编号，值是处理函数 |
| apply | 执行并返回入口函数 |
下面说明 handlers 的使用：
add 函数是添加入口函数的函数，需要传入一个入口函数，返回添加后的入口函数编号。编号可以用于 get 函数获取入口函数。例如：
----- ---------- - ---------------------------
----- ---- - ----- -- -- -
----- - ---- ---- ----- - - ----- -----------------------------
----- ------------ - -- -- -
-- ---- ---- ----
-
----- ------------ - -----------------
----- ------------------ - -----------------
------------------------------ --- ------------- -- ----
----- ------ - ----- -------
------------------- -- ------------ -------
-
------------------ -- -------------------get 函数是获取入口函数的函数，需要传入一个入口函数编号。如果找到对应的函数，返回该函数；否则返回 undefined。
set 函数是设置入口函数的函数，需要传入入口函数的编号和新的入口函数。如果找到对应的函数，替换成新的函数，返回 true；否则返回 false。
getAll 函数是获取所有的入口函数，返回一个键值对的对象，键是入口函数编号，值是入口函数。例如：
----- ---------- - --------------------------- ----- ---- - ----- -- -- - ----- - ---- ------ - - ----- ----------------------------- ----- ------------- - -- -- - -- ---- ---- ---- -- - ----- ------------- - -- -- - -- ---- ---- ---- -- - ------------------ ------------------ ----- -------------- - -------- ------------------------------------------ -- --------------- -------------- - ------------------ -- -------------------
apply 函数是执行入口函数的函数，返回执行结果。例如：
----- ---------- - ---------------------------
----- ---- - ----- -- -- -
----- - ---- ----- - - ----- -----------------------------
----- ------------ - -- -- -
------ ------ -------
-
-----------------
----- ------ - ----- -------
------------------- -- ------ -------
-
------------------ -- -------------------结语
通过上述文章，你已经可以使用@the-/entrypoint 包，规范入口文件的开发、修改、扩展等工作，更好地支持代码拆分、降低代码耦合性、提高代码复用率。当然，@the-/entrypoint 包还有更多特性，细节可以参考官方文档。
示例代码
更全面的示例代码，可以参考下面的代码：
----- ---------- - ---------------------------
----- -------------- - ----- -- -- -
-----------------------------
-
----- --------------- - ----- -- -- -
------------------------------
-
----- --------------- - ----- --- --------- -- -
------------------------------
----- - --- - - --------
----- ------------ - ----- -- -- -
------ ------ -------
-
-- ---------------
----- ------------ - -----------------
--------------------------- -------------
-
----- ----------------- - ----- -- -- -
--------------------------------
-
----- ---- - ----- -- -- -
--------------------
-- ------ -----------
-- -------------------------------
-- ----------------------------------------------
----- - ---- ---- ---- ------- ----- - - ----- ----------------------------- -
------------ ------
------- ---------------
-------- ----------------
-------- ----------------
---------- ------------------
--
-- ----------------
----- ------ - ----- -------
--------------------- -------
-- ----------- --------
----- -------- - --------
---------------------
-
------------------ -- -------------------来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/191026