摆脱复杂环境配置！教你如何直接在浏览器编译ES6+/TS代码

文章预览

大厂技术    高级前端    Node进阶 点击上方  程序员成长指北 ，关注公众号 回复 1 ，加入高级Node交流群 背景 我们都知道 Babel 本身是一个 JavaScript 编译器，主要用于将现代 JavaScript (比如 ECMAScript 2015+ ， TypeScript ， JSX 等)转换为向后兼容的 JavaScript ，方便在较旧的浏览器环境中下运行。而且 Babel 的编译过程是在构建过程（ Webpack，Vite,Gulp 等构建工具）进行，不会在 浏览器中实时编译 。 浏览器默认不支持 Babel 的原因主要是性能考虑和开发流程。 Babel 的设计初衷应该就是作为一个编译工具，在构建阶段使用，而不是在浏览器中实时执行。 但是我们有时候想在浏览器环境中实现 JavaScript/TS 的编译过程，比如在线编辑器中 CodePen ES10等 代码的执行需要先编译后执行等，这时候浏览器实现编译是一个必不可少的需求。 接下来我们文章的主 ………………………………