通过 Vite 构建我们完全可以兼容各种低版本浏览器，打包出既支持现代(Modern)浏览器 又支持旧版(Legacy)浏览器的产物。

为什么在 Vite 中能够彻底解决低版本浏览器的兼容性问题，以及通过什么手段解决，需 要借助哪些 JS 的工具和生态？
@babel/preset-env、core-js、regenerator-runtime等等工具和基础库的强强联合 ，官方的 Vite 插件@vitejs/plugin-legacy将这些底层的工具链接入到 Vite 中， 并实现开箱即用。

场景复现 #

首先我们来复现一下问题场景，下面两张图代表了之前我在线上环境真实遇到的报错案例:

某些低版本浏览器并没有提供 Promise 语法环境以及对象和数组的各种 API，甚至不支 持箭头函数语法，代码直接报错，从而导致线上白屏事故的发生，尤其是需要兼容 到IE 11、iOS 9以及Android 4.4的场景中很容易会遇到。