前言
enrels 是一个能够动态加载外部资源的 npm 包，主要用于前端开发中的资源加载，可以实现在运行期动态添加和管理多个脚本和样式文件。本文将对 enrels 的使用进行详细介绍，并附上实用示例代码。
安装
在命令行中输入以下命令即可安装 enrels：
--- ------- ------
使用
使用 enrels 非常简单，只需要在 HTML 代码上添加对应的标签即可。
加载 JavaScript 脚本
在 head 中添加以下代码：
------- ----------------------- ----------- -------------------------------------------------
其中，enrels.js 是 enrels 的核心文件，可以在 https://github.com/deanshub/enrels 下载；id 属性是一个必须的属性，data-source 属性是脚本文件的地址。
加载 CSS 样式
在 head 中添加以下代码：
----- ------------------------- ----------- --------------------------------------- -----------------
和加载 JavaScript 脚本一样，id 属性是必须的，data-source 属性是样式文件的地址，rel 属性为 stylesheet。
加载图片
在 body 中添加以下代码：
---- ----------------------- ----------- ----------------------------------------
id 属性和 data-source 属性是必须的，src 属性指定 enrels.js 的位置，因为图片需要作为资源被加载，所以 enrels.js 并不是必须存在的。
删除脚本和样式
enrels 提供了删除脚本和样式的方法，我们可以通过 enrels 对象调用 delete 方法，示例代码如下：
------------------------------------------- -- ------ ------------------------------------------- ------------------------------ -- ------
实用示例
下面我们来看一下 enrels 在实际项目中的使用。
动态加载多语言包
我们可以使用 enrels 动态加载多语言包，这样可以减少首屏加载时间，提高网页性能。
------- ----------------------- ---------------------
--------
--- ---- - ---------------------------- -- ----- -- - ------------ -------------
--- --------- - ----------------------- - ---- - ------
----------------------- -- -------
---------懒加载页面中的图片
enrels 也可以实现图片的懒加载，以此来提高网页性能。
---- ------------------------------------- ------------------------------------ ------------
------- -----------------------------------------
--------
--- --- - ----------------------------------
--------------------- -- ----
---------总结
enrels 是一个非常实用的 npm 包，可以让我们在前端开发中更加灵活地加载和管理外部资源。本文对 enrels 的使用进行了详细介绍，并给出了实用示例代码，希望对大家有所帮助。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/60057b0b81e8991b448eb776