随着 ES6 语法的普及和浏览器对 ES6 功能的支持度不断提高，越来越多的前端项目开始使用 ES6 语法编写代码。而为了使代码兼容旧版本的浏览器，需要使用 Babel 转换 ES6 语法。
然而，尽管 Babel 有很好的转换 ES6 语法为 ES5 的能力，但在使用 Babel 转换时，往往会出现一个问题：在转换后的代码中，Promise 会出现未定义的情况。
问题分析
在使用 Babel 进行转换时，Babel 默认只会转换语法，但不会转换新的 API，比如 Promise、Generator、Set 等。因此，在转换后的代码中出现 Promise 未定义的问题是很常见的。
例如，下面的 ES6 代码中使用了 Promise：
// ES6 代码
new Promise(resolve => resolve('resolved')).then(console.log);使用 Babel 转换后得到的 ES5 代码如下：
-- -------------------- ---- -------
-- ---- --- --
--- -----------------------------------
-------- ----------- -
------ -------------------- -----------
-
-------- ---------- -
-------- - --------------------------- ----- -
------ ----
---
------ -------------------- -----------
-可以看到，在转换后的代码中，并没有引入 Promise 的 polyfill，导致 Promise 未定义。这时候，如果直接在旧版本的浏览器中运行代码，就会报 Promise 未定义的错误。
那么，该如何解决这个问题呢？
解决方案
解决 Promise 未定义的问题，需要引入 Promise 的 polyfill。Promise 的 polyfill 可以使用 es6-promise 库来实现。
具体来说，只需要在项目中安装 es6-promise 库：
npm install es6-promise --save
然后，在项目的入口文件中，引入 Promise 的 polyfill：
// 引入 Promise 的 polyfill import 'es6-promise/auto';
这样做的原理是，在 es6-promise 库的 auto.js 文件中，会自动检测浏览器是否支持 Promise，如果不支持，则会引入 Promise 的 polyfill。
引入 polyfill 后，再用 Babel 进行转换，就可以得到与 Promise 相关的 ES5 代码了：
-- -------------------- ---- -------
-- ---- --- --
--- -----------------------------------
-------- ----------- -
------ -------------------- -----------
-
-------- ---------- -
-------- - --------------------------- ----- -
------ ----
---
------ -------------------- -----------
-可以看到，在转换后的代码中，已经引入了 Promise 的 polyfill，大大提高了代码的兼容性。
总结
Babel 是一个强大的工具，可以将 ES6、ES7 等新语法转换为 ES5 等旧版 JavaScript。但在使用 Babel 进行转换时，需要注意新的 API 没有被转换的问题，比如 Promise、Generator、Set 等。要解决这个问题，只需要引入对应的 polyfill，就可以让转换后的代码在旧版本的浏览器中正常运行。
代码示例：
// ES6 代码
new Promise(resolve => resolve('resolved')).then(console.log);-- -------------------- ---- -------
-- ---- --- --
------ -------------------
--- -----------------------------------
-------- ----------- -
------ -------------------- -----------
-
-------- ---------- -
-------- - --------------------------- ----- -
------ ----
---
------ -------------------- -----------
-来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64c4e09483d39b488183ee29