前言
在前端开发中，我们经常需要引用其他人开发的第三方库，这些第三方库一般都会发布到 npm 上面。如果每次都将这些库下载到本地，再手动引用，会显得非常麻烦。而 npm 包 importer 就是为解决这个问题而生的。
npm 包 importer 可以直接在 HTML 中引用 npm 包，不需要事先安装到本地，也不需要通过 script 标签引用。本教程将对 importer 的使用方法和相关注意事项进行详细介绍和说明，并提供示例代码。
安装 importer
在使用 importer 之前，我们需要先安装它。可以通过命令行工具（如 Powershell 或 Git Bash）来进行安装：
npm install -g importer
安装完成后，我们就可以在项目中使用 importer 了。
使用 importer
引用 npm 包
在 HTML 文件中使用 importer，需要将 script 标签的 type 属性设置为 module。然后在 src 属性中，指定 npm 包的路径即可。例如：
<script type="module" src="https://unpkg.com/lodash"></script>
这里的 lodash 是一个非常实用的 JavaScript 工具库，我们可以直接使用它提供的函数，例如：
console.log(_.chunk(['a', 'b', 'c', 'd'], 2)); // → [['a', 'b'], ['c', 'd']]
指定 npm 包的版本
如果需要使用特定版本的 npm 包，可以在 src 属性中指定该版本的路径。例如：
<script type="module" src="https://unpkg.com/lodash@4.17.15"></script>
这里的 lodash 版本是 4.17.15，我们可以继续使用它提供的函数。
引用本地 npm 包
除了直接引用外部的 npm 包，我们也可以直接引用本地已经安装的 npm 包。例如：
<script type="module" src="./node_modules/lodash"></script>
这里的路径是相对于当前 HTML 文件的路径。如果在项目根目录下执行了 npm install lodash 命令，那么就可以直接在 HTML 中使用该 npm 包。
引用多个 npm 包
如果需要引用多个 npm 包，可以使用多个 script 标签。例如：
<script type="module" src="https://unpkg.com/lodash"></script> <script type="module" src="https://unpkg.com/jquery"></script>
这样就可以同时引用 lodash 和 jquery 这两个 npm 包了。
总结
npm 包 importer 是一个非常实用的工具，可以方便地引用 npm 包，避免了手动下载和引用的麻烦。在实际开发中，我们可以根据需要，灵活地使用这个工具来提高开发效率。
示例代码
-- -------------------- ---- ------- --------- ----- ------ ------ ----- ---------------- --------- -------- -- --- --------- ------- ------------- ---------------------------------------- ------- ------ ------ -------- -- --- ------ ---- ------------------ -------- --- ------ - ------------- ---- ---- ----- --- ------------------------------------------- - ----------------------- --------- ------- -------展开代码
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/76939
