简介
npm 是一个 JavaScript 的包管理工具，一方面可以把现有的 Open Source 模块收集到一个巨大的生态系统中，另一方面也可以帮助开发工程师分享自己的开发成果，并迅速得到其它工程师的使用和反馈。其中， clay-resource 是一个使用 npm 包管理工具的前端资源加载器，它可以帮助我们更好、更方便地管理前端资源，减少开发工作量，提升开发效率。
安装
安装 clay-resource 非常简单，我们只需要执行以下命令即可：
npm install --save clay-resource
当然，我们也可以使用 yarn 来安装：
yarn add clay-resource
使用
使用 clay-resource 非常方便，并且它提供了很多强大的功能和参数，接下来我们通过一个实际的例子来介绍一下如何使用 clay-resource。
假设我们现在需要在一个 HTML 页面中引入一个 jQuery 库，那么我们可以这样写：
-- -------------------- ---- ------- --------- ----- ------ ------ ------- ----------------------------------------------------------- ------- ------ ------- -------
但是我们发现，在这个页面中我们还使用了一个 bootstrap 库，如果我们直接在页面中引入，那么它就会和 jQuery 一样，让我们的页面变得臃肿而不利于维护。这时候，我们可以使用 clay-resource 来解决这个问题。
首先我们需要在前面加入对 clay-resource 的引用：
-- -------------------- ---- ------- --------- ----- ------ ------ ------- ------------------------------------------------------------------------------------ ------- ------ ------- -------
然后我们就可以使用 clay-resource 的 API 来加载 bootstrap 库了：
-- -------------------- ---- -------
--------- -----
------
------
------- ------------------------------------------------------------------------------------
--------
----------------------------------------------------------------------------------
--------------------------------------------------------------------------------
---------
-------
------
-------
-------如上代码所示，我们使用了 $cr.load 来加载了一个 bootstrap 的样式表和 JS 文件。其中，load 是一个加载器函数，在括号中传递需要加载的资源的 URL 即可。
深入
除了以上简单的用法之外，clay-resource 还提供了很多强大的参数和 API。比如说我们可以使用 $cr.import 来引入一个函数，并传递一个回调函数：
-- -------------------- ---- -------
--------- -----
------
------
------- ------------------------------------------------------------------------------------
--------
--------------------------------------------------------- ---------------- -
--------------------
---
---------
-------
------
-------
-------在这个例子中，我们成功引入了 jQuery 并打印出它的信息。
另外，$cr 还提供了很多 API，比如说我们可以使用 $cr.prefix 方法来设置 load 中不需要传递完整 URL 的情况：
-- -------------------- ---- -------
--------- -----
------
------
------- ------------------------------------------------------------------------------------
--------
----------------------------------------------------------
------------------------------------------
---------
-------
------
-------
-------在这个例子中，我们使用了 $cr.prefix 来设置 URL 前缀，并使用 load 方法来引入 Dojo 库。
结束语
以上便是 clay-resource 的基本使用教程和深入 API 介绍，无论你是前端新手还是老手，都可以通过 clay-resource 来提高前端开发效率和维护性。同时，我们也可以学到很多关于 npm 包管理工具以及前端资源管理的知识。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedaa1db5cbfe1ea0610361