17

TL;DR：有没有办法指定 Babel 插件应该运行的顺序？Babel 是如何确定这个顺序的？除了深入研究 Babel 资源之外，还有什么规范吗？

我正在开发自己的 Babel 插件。我注意到，当我运行它时，我的插件在其他 es2015 插件之前运行。例如有如下代码：

const a = () => 1

和访客，例如：

visitor: {
  ArrowFunctionExpression(path) {
    console.log('ArrowFunction')
  },
  FunctionExpression(path) {
    console.log('Function')
  },
}

我的插件观察 ArrowFunction（而不是 Function）。我按照插件在 Babel 配置中列出的顺序进行了操作，但这并没有改变任何东西：

plugins: ['path_to_myplugin', 'transform-es2015-arrow-functions'],
plugins: ['transform-es2015-arrow-functions', 'path_to_myplugin'],

OTOH，这看起来顺序确实很重要：

https://phabricator.babeljs.io/T6719

- - 编辑 - -

我发现如果我这样写我的访问者：

  ArrowFunctionExpression: {
    enter(path) {
      console.log('ArrowFunction')
    }
  },
  FunctionExpression: {
    exit(path) {
      console.log('Function')
    }
  },

这两个函数都被调用。所以看起来执行顺序是：myplugin_enter -> other_plugin -> myplugin_exit。换句话说， myplugin 在某些内部管道中似乎在 other_plugin 之前。然而，主要问题保持不变 - 管道中插件的顺序应该以某种方式确定和配置。

4

2 回答 2

17

插件的顺序基于您.babelrc的插件在预设之前运行的顺序，并且每个组在较早的插件/预设之前运行后来的插件/预设。

关键是排序是每个 AST 节点。每个插件不会进行完全遍历，Babel 会进行一次遍历，并行运行所有插件，每个节点一次处理一个，运行每个插件的每个处理程序。

于 2016-01-05T19:58:21.153 回答
7

基本上，@loganfsmyth 写的是正确的；插件排序本身（可能）不再有魔力。

至于我的具体问题，我的困惑是由箭头函数转换的工作原理引起的。即使babel-plugin-transform-es2015-arrow-functions插件比我的插件更早地破坏了代码，它也不会从 ast 中删除原始的箭头函数 ast 节点，因此即使是后来的插件也能看到它。

学习：在与 Babel 打交道时，不要低估了解正在发生的事情所需的调试打印语句的数量。

于 2016-02-28T14:29:01.937 回答