需要读到入口文件里面的内容。 分析入口文件，递归的去读取模块所依赖的文件内容，生成AST语法树。 我们创建了add.js文件和minus.js文件,然后 在index.js中引入，再将index.js文件引入index.html。 现在我们打开index.html。你猜会发生什…

这篇文章目的是介绍如何创建一个ESLint插件和创建一个ESLint rule，用以帮助我们更深入的理解ESLint的运行原理，并且在有必要时可以根据需求创建出一个完美满足自己需求的Lint规则。 禁止项目中setTimeout的第二个参数是数字。 PS： 如果是数字的话，很容…

对 Babel 的配置项的作用不那么了解，是否会影响日常开发呢？老实说，大多情况下没有特别大的影响（毕竟有搜索引擎）。 不过呢，还是想更进一步了解下，于是最近认真阅读了 Babel 的文档，外加不断编译验证，输出了本篇文章，为了更好的阅读体验，修修改改，最终算是以我个人比较喜欢…

AST 是一个非常基础但是同时非常重要的知识点，我们熟知的 TypeScript、babel、webpack、vue-cli 得都是依赖 AST 进行开发的。本文将通过 AST 与前端工程化的实战向大家展示 AST 的强大以及重要性。 第一次看见 AST 这个概念的时候还是在《…

Webpack 迭代到4.x版本后，其源码已经十分庞大，对各种开发场景进行了高度抽象，阅读成本也愈发昂贵。但是为了了解其内部的工作原理，让我们尝试从一个最简单的 webpack 配置入手，从工具设计者的角度开发一款低配版的 Webpack。 假设某一天，我们接到了需求，需要开发…

JavaScript Parser，把js源码转化为抽象语法树的解析器。 浏览器会把js源码通过解析器转为抽象语法树，再进一步转化为字节码或直接生成机器码。 一般来说每个js引擎都会有自己的抽象语法树格式，Chrome的v8引擎，firefox的SpiderMonkey引擎等等…

“转转二手”是我司用wepy开发的功能与APP相似度非常高的小程序，实现了大量的功能性页面，而新业务H5项目在开发过程中有时也经常需要一些公共页面和功能，但新项目又有自己的独特点，这些页面需求重新开发成本很高，但如果把小程序代码转换成VUE就会容易的多，因此需要这样一个转换工具…

简单来说就是：将 *.vue 文件变成 *.bundle.js，然后放入浏览器运行。 以上的输出就是最终可以拿到浏览器上运行的 javaScript，尽管笔者已经删除了一些会影响理解的部分代码，但是这么直接观察这个文件，难免还是无从下手。 那么我们继续细化分析步骤，vue-lo…

经过之前的三篇文章介绍，AST的CRUD都已经完成。下面主要通过vue转小程序过程中需要用到的部分关键技术来实战。 注意:，跟我们之前介绍的一致，为了完成上述转换，要把输入和输出均放入AST explorer，查看其先后的结构对比。 将所有的this.[data member]…