Babel 是什么？它的编译流程和 polyfill 方案有哪些？

Babel 是 JavaScript 转译器，将 ES6+ 语法转为向后兼容的 ES5 代码，确保在旧浏览器中正常运行。编译流程分三步：parse（@babel/parser 将源码转 AST）→ transform（插件遍历 AST 并修改节点）→ generate（@babel/generator 将 AST 还原为代码）。注意 Babel 只转换语法，不补齐新 API（如 Promise、Array.includes），需要 polyfill 方案配合。

追问

Babel 的 plugin 和 preset 是什么关系？ plugin 是最小转换单元（如 @babel/plugin-transform-arrow-functions），preset 是插件集合（如 @babel/preset-env 包含所有 ES6+ 转换插件）。执行顺序：plugins 先于 presets，plugins 正序执行，presets 逆序执行。

@babel/preset-env 的工作原理是什么？ 根据 browserslist 配置的目标环境，按需引入转换插件和 polyfill，避免对已支持语法的多余转换。配合 useBuiltIns: 'usage' 可实现按需注入 polyfill。

polyfill 方案有哪些？core-js 和 transform-runtime 有什么区别？ core-js 直接在全局注入缺失 API，适合应用项目；@babel/plugin-transform-runtime 将 polyfill 抽离为模块引用（不污染全局），适合库开发，还能避免 helpers 重复打包。

Babel 能替代 Webpack 吗？ 不能。Babel 只做语法转译，不做模块打包、代码分割、Tree Shaking、资源处理，这些是 bundler 的职责。两者配合使用。

写段代码

javascript
// babel.config.js
module.exports = {
  presets: [
    ['@babel/preset-env', {
      targets: '> 0.25%, not dead',
      useBuiltIns: 'usage',
      corejs: 3
    }]
  ],
  plugins: ['@babel/plugin-transform-runtime']
};