防止 babel class 属性插件覆盖我生成的构造函数

Question

概览

我写了一个 babel 插件，可以将自定义构造函数添加到 classes。我还使用 @babel/plugin-proposal-class-properties 插件来支持 class 属性。我的 .babelrc 看起来像这样：

{
  "plugins": [
    "./plugins/my-plugin.js",
    "@babel/plugin-proposal-class-properties",
  ]
}

我正在使用 babel-core@7.2.2 和 @babel/plugin-proposal-class-properties@7.2.3。

问题

class 属性插件覆盖了我生成的构造函数。例如，给出这个测试文件：

// Source
class Test extends Base {
    // someProp = 'yay';
}

如果我运行没有 class 属性插件，我的构造函数被插入：

// Transpiled (no class props)
class Test extends Base {
    constructor() {
        super(...arguments);

        console.log('my special custom code');
    }
}

但是如果我取消注释 someProp 并启用 class 属性插件，我的自定义代码将被覆盖：

// Transpiled (with class props)
class Test extends Base {
    constructor(...args) {
        super(...args);

        _defineProperty(this, "someProp", 'yay');
    }
}

我列出插件的顺序似乎无关紧要。这是预期的吗？是否有解决方法，或者这是一个错误？

我认为我的插件的实现不重要 - 但如果重要，我可以添加更多细节。

感谢任何帮助。谢谢！

Answer 1

我最终在 Babel slack 社区寻求帮助，他们能够帮助我解决这个问题。

问题是我在实施中使用了不同的访问者 - 我为 ClassDeclaration 和 ClassMethod 指定了访问者，但 plugin-proposal-class-properties 实施中的访问者在 Class。当我更改我的代码以关闭 Class 并确保我的运行首先时，属性已按预期添加到我的自定义构造函数中。

防止 babel class 属性插件覆盖我生成的构造函数

Prevent babel class properties plugin from overwriting my generated constructor

babeljs

babel-plugin