从前端编译到手写 Babel

编译这个概念好像离前端很遥远，遥远到好像工做面试都不要求相关的知识。

可是，真的遥远么？

咱们天天用 Babel、Typescript Compiler 来作代码的转换，用 Vue Template Compiler 来作 Vue 模版的解析，还会用 Eslint 作代码的静态检查、用 Terser 作代码压缩，最重要的是咱们的 JS 代码是跑在 JS 引擎上的。

这些不都是编译技术么？

如今，你还以为编译离前端很遥远么？

其实，并非编译技术在前端用不到，而偏偏是由于太过经常使用而容易被忽略。咱们会去学习一些工具的使用，但不会去学习更底层的一些原理。

因此，我第一次的直播分享就起名为《从 Babel 深刻前端编译原理》，就是想借助 Babel 来像你们展现一下编译技术能作什么：

能够作一些对业务有意义的事情： 自动埋点、自动国际化、自动生成 API 文档

能够作一些工具：Typescript 类型检查、压缩混淆、Linter

还能够基于 Babel Parser 实现 JS 解释器

这些，直播中都实现了。

live.juejin.cn/4354/481502…

固然，首先仍是从基础开始，要先了解编译流程、AST、api，以后才是各类实战。直播的前半部分是一些基础知识的铺垫。

讲完以后，咱们作了总结：

前端领域主要用到转译、解释、编译这三种编译技术。

转译是源码转源码的转换编译器，好比 Babel、Typescript、Terser 等都是这种，这也是咱们最经常使用的

解释是解释执行源码，好比各类 JS 引擎，包括 V八、JavascriptCore，Hermes 等

编译是指高级语言到低级语言，好比字节码的转换，前端的新技术 WebAssembly 就涉及到编译器的知识。

直播和小册中可以入门前两种。

直播结束以后，有很大一部分同窗对前端领域的编译技术能作什么有个一个清晰的认识，也知道了 Babel 这个工具怎么用。

可是，这些还不够，咱们不能只知足于用，就像小册的名字《Babel 插件通关秘籍》，只会用怎么算通关呢？

因此，咱们手写一个 Babel，帮助你们完全通关。

下期直播的内容就是《手写 Babel》。

（在那以前小册也会更完的）

若是说第一期是介绍编译技术能作什么，是一个广度的扩充，那么第二期就是把 Babel 讲透，是一个深度的扩充。

没看第一期的同窗，能够看下回放。对 Babel 感兴趣的同窗能够继续参与第二期直播（8 月 12 晚 8点），一起手写一个 Babel！

编译，其实并不遥远。