使用@codemod/cli运行Babel插件时addComment方法失效问题求助

你遇到的差异来自@codemod/cli的默认配置和astexplorer的默认Babel运行配置不一致：

1. @codemod/cli默认开启retainLines参数，该参数的作用是尽量保留原代码的行号位置，副作用是会直接丢弃挂载在顶级Program节点上的前置注释。
2. 你当前的实现是把注释绑定在Program节点本身，而非Program body内的语法节点上，@codemod/cli的输出逻辑不会处理Program节点的顶级leading注释。

方案1（推荐）：把注释绑定到插入的空语句节点上 #

修改插件代码，将注释直接挂载到你要插入的空语句节点，避免依赖Program节点的注释输出逻辑：

module.exports = function (babel) {
    const { types: t } = babel;
    return {
        name: 'addComment',
        visitor: {
            Program(path, state) {
                const emptyStmt = t.noop();
                // 第三个参数为true表示注释末尾自动添加换行
                emptyStmt.addComment('leading', '@@@ My precious @@@', true);
                path.unshiftContainer('body', emptyStmt);
            }
        }
    };
}

修改后直接用原来的命令运行即可生效。

方案2：禁用@codemod/cli的retainLines配置 #

不需要修改插件代码，运行命令时添加--no-retain-lines参数即可：

./node_modules/.bin/codemod --no-retain-lines --plugin ./babel-plugin.js ./transform-me.js

内容的提问来源于stack exchange，提问作者konclave