什么是 es-module-shims？
es-module-shims 是一个 npm 包，它可以将旧的非模块化 JavaScript 代码转换为浏览器可识别的模块化代码。这个包解决了在使用原生 ES6 模块时遇到的一些兼容性问题。
为什么要使用 es-module-shims？
在使用原生 ES6 模块的时候，由于不同浏览器对模块支持的程度不同，导致一些兼容性问题。例如，IE 浏览器不支持使用 import 和 export 语句，这个时候就可以使用 es-module-shims 来将代码转换为浏览器可以识别的模块化代码。
使用 es-module-shims，我们还可以避免在项目中使用多个模块加载器（例如 RequireJS 和 SystemJS）的问题，同时可以方便地将旧有的非模块化 JavaScript 代码转换为模块化代码以便于管理。
如何使用 es-module-shims？
以下是使用 es-module-shims 的步骤：
1. 安装 es-module-shims
使用 npm 安装 es-module-shims 包：
npm install es-module-shims --save-dev
2. 在 HTML 中引入 es-module-shims
在需要使用 es-module-shims 的 HTML 文件中，引入 es-module-shims：
<script src="./node_modules/es-module-shims/dist/es-module-shims.js"></script>
3. 在 JavaScript 文件中使用 es-module-shims
在需要使用 es-module-shims 的 JavaScript 文件中，通过以下方式来加载并使用依赖：
-- -------------------- ---- -------
------ - ---------- - ---- ---------------------------------------------------------
--------- -- -
-- ----
------------------------------------ ----- -
-- ------------
---------------------
---
-----我们可以看到，在这个示例代码中，importShim() 方法被使用来加载依赖，这个方法会返回一个 Promise 对象。在 Promise 对象完成的时候，我们可以在回调函数中对应的执行代码。
在 importShim() 中，我们传入了需要加载的依赖文件路径。例如，在这个示例中，我们需要加载名为 dep.js 的依赖模块。
结论
es-module-shims 是一个非常实用的 npm 包，它可以帮助我们在对旧项目进行迁移时更加方便地使用原生 ES6 模块，同时它也可以解决浏览器对模块支持的兼容性问题。虽然在使用 es-module-shims 的过程中需要遵循一定规范，但使用这个工具是一种让我们更加轻松愉悦地管理前端项目的方案。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedcc5bb5cbfe1ea061276d