바벨 플러그인 (방문자 패턴) - 작동 방식

Question

바벨 플러그인에서 두 가지 대체품을 원합니다. 두 번째 교체 작업은 첫 번째 작업이 완료된 후에 만 ​​수행해야합니다.

module.exports = function(babel) { 
    const t = babel.types; 
    return { 
     visitor: { 
      FunctionExpression: function(path) { 
       //Conversion to arrow functions 
       path.replaceWith(t.arrowFunctionExpression(path.node.params, path.node.body, false)); 
      }, 
      ThisExpression: function(path) { 
       //Converting all this expressions to identifiers so that it won't get translated differently 
       path.replaceWith(t.identifier("this")); 
      } 
     } 
    }; 
} 

"FunctionExpression"의 AST 트리에서 "ThisExpression"은 트리 아래 어딘가에 있습니다. 두 번째 변환이 완료된 후에 만 ​​첫 번째 변환이 발생하도록하고 싶습니다. 이것을 어떻게 성취합니까?

Answer 1

알아 냈습니다. 바벨 플러그인을 작성하는 방법을 이해하는 가장 좋은 곳입니다.)

, Here

module.exports = function(babel) { 
    const t = babel.types; 
    return { 
     visitor: { 
      FunctionExpression: { 
       enter: function(path) { 
        path.traverse(updateThisExpression); 
        //Conversion to arrow functions 
        let arrowFnNode = t.arrowFunctionExpression(path.node.params, 
         path.node.body, false); 
        path.replaceWith(arrowFnNode); 
       } 
      } 
     } 
    }; 
} 

const updateThisExpression = { 
    ThisExpression: { 
     enter: function(path) { 
      //Converting all this expressions to identifiers so that 
      //it won't get translated differently 
      path.replaceWith(t.identifier("this")); 
     } 
    } 
}; 

당신은 당신이 "FunctionExpression"방문자 .. 내 통과하는 데 사용하는 다른 방문자 객체를 쓰기