简介
在开发前端时，我们通常会使用 npm 包来构建我们的项目。而其中一些 npm 包会在内部使用 UMD （Universal Module Definition）模块规范来支持在不同执行环境中使用不同的模块化方案。在这种情况下，UMD 包通常不具有一个全局的名称，UMD 模块仅暴露在一个巨大的对象（通常称为 umdName）下。这使得我们在使用 UMD 包时经常会遇到问题，因为我们需要引用这个巨大对象下的一个子属性或方法。在这种情况下，我们可以使用 umdname 这个 npm 包来给我们的 UMD 包提供一个全局名称，以便我们更方便的使用它。
安装
要使用 umdname，我们需要先在项目中安装它。在终端中输入以下命令来安装 umdname：
--- ------- ------- -----
配置 umdname
在安装了 umdname 之后，我们需要在我们的项目中配置它。在 package.json 文件中，我们可以添加一个 umdName 属性来配置整个项目的 umdName。例如：
- ------- ------------- ---------- -------- ---------- ----------- -
然后在安装了 umdname 后，我们可以提供一个 npm 脚本来使用它。例如：
-
---------- -
---------- -------- -- -----------------
-
-在这个例子中，我们把 umdname 的配置文件放到了 .umdnamerc.js 中，此时我们需要创建它并按照 umdname 的要求进行配置。例如：
-------------- - - ----------- ----------------------------------------------- ----------- ------------------------------------------------- ---------- ----------- -
在这个配置文件中，我们告诉 umdname 我们的输入文件是 my-package.js，并指定输出文件的名称。我们也指定了 globalVar 的名称，这个名称将成为全局变量的名称。
使用 umdName
安装并配置 umdName 后，我们就可以使用已经设置了 umdName 的 npm 包了。例如，在使用 Vue.js 时，如果我们配置了它的 umdName 为 Vue，那么我们可以通过以下方式来使用它：
------ --- ---- ------
--- -----
--- -------
----- -
-------- ------ ------
-
---而不需要通过 Vue.default 来引用的方式。
结论
作为前端开发人员，我们经常需要使用一些 UMD 规范的 npm 包。通过使用 umdname，我们可以方便地设置一个全局变量，从而更轻松地使用这些包。要使用 umdname，我们只需要安装它，配置它，然后就可以愉快地使用它了。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/76101