webpack会采用AST作为模块输入吗？

Question

目前webpack处理文件,它通过加载器解析以确定依赖关系.

当使用babel时,babel会解析一个文件,并且有足够的信息可以直接告诉webpack它有哪些依赖项.据我所知,没有办法将这些丰富的信息直接传递给webpack,babel必须生成一个JavaScript文件作为文本,然后webpack将重新解析以提取依赖信息.

(a)我的总结是否正确？这是现在发生的事吗？(b)是否有任何计划允许这样的层之间更紧密的集成？我希望这对构建时间有相当不错的影响.

Answer 1

(a)同意,本摘要是正确的.这主要是因为在不同的工具中过去没有常见的AST格式.最近,随着ESTree Spec的变化.但是,我不知道这些AST在实际项目中是如何互操作的.比较astexplorer.net上的AST ,看起来AST有些相似.Webpack目前的设计很浪费,但它提供了良好的互操作性.

(b)我不知道有任何关于此的计划.但我也已经考虑过了.JS不是唯一被解析多次的语言:在大多数webpack构建链中,Sass被解析并转换为CSS,CSS由postcss-loader解析,后者通常应用自动前缀并输出CSS,然后再次通过CSS解析CSS css-loader(有趣地再次由PostCSS)并转换为JS,由webpack再次解析,以找出依赖图.这是非常低效的(并且已经存在问题),但是这样您就可以集成任何能够理解源代码的工具.

但是,存在使编译器更可插拔的趋势.最突出的例子是Babel和PostCSS.因此,autoprefixer-loader已被弃用,转而使用PostCSS插件.甚至官方委员会成员都在使用API​​来拦截浏览器内的语言处理,如CSS-TAG Houdini Task Force或JavaScript decorators提案.

我期待更多像Babel和PostCSS这样的工具.这可能会导致webpack构建链中的单独加载器所做的工作减少,而这些工具环境中的更多工作也会更少 - 这实际上是一件好事,因为这些工具可以在webpack上下文之外重用.看到更多编译器提供跳过代码生成并立即重用AST的方法真的很棒.

关于webpack的现状:

还有一个鲜为人知的加载器功能,称为value/inputValue.它旨在将元信息从一个加载器传递到另一个加载器.因此,它可以用作跳过不必要的解析的快捷方式.您可以在webpack @ 1中使用此功能.但是,此功能目前在webpack @ 2的beta分支上不可用(不知道为什么).
- sokra告诉我,他已经删除了webpack @ 2中的这个遗留功能,所以这已经不再安全了

装载机可能有多个输入和输出.由于JavaScript不允许多个return值,因此只能通过调用来实现输出this.callback.当前的约定是第一个值始终是实际的加载器内容.第二个值是源映射(如果已激活).所以我们可以使用第三个值作为传递AST的方法.然而,这目前尚未实施.但我们可以从它开始.

顺便说一句:Mark Finger最近对这个话题进行了一些有价值的研究.您可能也对他的发现感兴趣.