你是否遇到过在使用 npm 包时需要手动引入外部脚本的麻烦呢？npm 包 script-load 可以利用 package.json 中的 jsdelivr、unpkg 和 browser 字段，让你轻松加载外部脚本并且减轻你的负担。
安装
通过 npm 安装 script-load：
npm install script-load
并在你的项目中引入：
const { scriptLoad } = require('script-load');或者使用 ES6 的 import 语法：
import { scriptLoad } from 'script-load';使用方法
使用 scriptLoad 来加载外部脚本：
scriptLoad(src[, options])
其中，src 是你需要加载的外部脚本链接地址（你也可以使用为数组形式批量添加），options 是一个可选的可配置项，包括：
type: 用于指定脚本资源的类型，默认为 js。charset: 用于指定资源的字符集。isAsync: 用于指定脚本是否异步加载，默认为 true。isDefer: 用于指定脚本是否延迟加载，默认为 false。timeout: 用于指定加载超时时间（单位毫秒），默认为 0。
以下是一个使用 scriptLoad 加载外部脚本的示例：
-- -------------------- ---- -------
----- --------- - ---------------------------------------------------------------------
--------------------- -
----- ------------------
-------- -----
--
-------- -- -
-- --------
------------------- ---------
--
------------ -- -
-- -------
-------------------
---配置选项
jsdelivr
jsdelivr 是一个快速、可靠的 CDN 服务提供商，它可以为你提供全球 CDN 加速，自动压缩 JS、CSS、HTML、SVG 等静态资源，帮助你节省带宽和流量。
你可以在 package.json 中的 jsdelivr 字段中指定你的项目的入口文件地址，从而让 script-load 帮你自动加载相应的脚本。
{
"name": "my-project",
"version": "1.0.0",
"jsdelivr": "path/to/my-project.js"
}在你的项目中引入 script-load：
-- -------------------- ---- -------
-- ------------
----- - ---------- - - -----------------------
----- --- - ---------------------------
------------------------
-------- -- -
------------------- ------ ---------------
--
------------ -- -
-------------------
---unpkg
unpkg 是另一个优秀的 CDN 服务提供商，它也可以为你快速地提供全球 CDN 加速以及精简脚本，适用于大多数 npm 包，也适用于一些浏览器中不支持的 npm 包使用。
你可以在 package.json 中的 unpkg 字段中指定你的项目的入口文件地址（或者使用不同的版本号），从而让 script-load 帮你自动加载相应的脚本。
{
"name": "my-project",
"version": "1.0.0",
"unpkg": "path/to/my-project.js"
}在你的项目中引入 script-load：
-- -------------------- ---- -------
-- ------------
----- - ---------- - - -----------------------
----- --- - ---------------------------
-----------------------------------------------------------------------
-------- -- -
------------------- ------ ---------------
--
------------ -- -
-------------------
---browser
在使用一些 npm 包时，你可能需要用到一些浏览器中才支持的 API（比如 window、document 等），此时就需要在 browser 字段中指定相应的浏览器端模块以供使用。script-load 支持直接加载这些模块，只需在 options 中设置 isModule 为 true 即可。
-- -------------------- ---- -------
-
------- -------------
---------- --------
---------- -
----- ------
------- ------
--------- ------
--------- ------
------- -----
-
-在你的项目中引入 script-load：
-- -------------------- ---- -------
-- ------------
----- - ---------- - - -----------------------
----- --- - ---------------------------
------------------------ -
--------- ----
--
-------- -- -
------------------- ------ ---------------
--
------------ -- -
-------------------
---总结
通过 script-load，你可以轻松地加载外部脚本并减轻你的负担。你可以在 package.json 中的 jsdelivr、unpkg 和 browser 字段中指定相应的入口文件地址，从而让 script-load 帮你自动加载相应的脚本。
示例代码：https://github.com/iamxiaozhou/script-load-example
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedb3edb5cbfe1ea06111f4