使用@babel/parser与@babel/generator进行AST转换时输入输出代码不一致问题咨询
使用@babel/parser与@babel/generator进行AST转换时输入输出代码不一致问题咨询
大家好,我最近在做代码AST转换相关工作时遇到了个头疼的问题:用@babel/parser把代码解析成AST,再用@babel/generator转换回代码后,输出结果和原始输入没法完全匹配,想请教下各位有没有解决办法?
先给大家看个简单的例子:
原始代码:
const Component = () => (123)
转换后输出:const Component = () => 123;
能明显看到箭头函数的返回括号被去掉了,还自动多了个分号。
后来我测试了带JSX的场景,问题同样存在,下面是完整的测试代码:
const fs = require('fs'); const { parse } = require('@babel/parser'); const generator = require('@babel/generator').default; const incomingCode = "const Component = () => (<div>123</div>)" // 将代码解析为AST const ast = parse( incomingCode, { sourceType: "module", plugins: ['jsx', 'typescript'] } ); // 将AST转换回代码 const outputCode = generator(ast, { retainLines: true }).code; console.log(incomingCode); // 控制台输出:const Component = () => (<div>123</div>) console.log(outputCode); // 控制台输出:const Component = () => <div>123</div>;
可以看到,原始代码里箭头函数返回JSX时包裹的括号被去掉了,同样自动添加了分号。我本来期望输入和输出的代码完全一致,但现在这些格式细节都发生了变化。有没有办法通过配置@babel/generator的参数,让它尽可能保留原始代码的格式风格呢?
备注:内容来源于stack exchange,提问作者Pavel Oreshkin
相关产品推荐
相关产品推荐

