@babel/traverse#Visitor TypeScript Examples

getVisitor(): Visitor {
    return {
      ExpressionStatement: (path) => {
        if (!t.isBlockStatement(path.parent) && !t.isSwitchCase(path.parent)) return;

        if (t.isLogicalExpression(path.node.expression) && path.node.expression.operator === '&&') {
          this.convertShorthandIf(path, path.node.expression, true);
        } else if (t.isLogicalExpression(path.node.expression) && path.node.expression.operator === '||') {
          this.convertShorthandIf(path, path.node.expression, false);
        } else if (t.isConditionalExpression(path.node.expression)) {
          this.convertShorthandIfElse(path, path.node.expression);
        }
      },
      ReturnStatement: (path) => {
        if (!t.isConditionalExpression(path.node.argument)) return;
        const eitherIsSeqExp = t.isSequenceExpression(path.node.argument.consequent) || t.isSequenceExpression(path.node.argument.alternate);
        const bothAreCondExp = t.isConditionalExpression(path.node.argument.consequent) && t.isConditionalExpression(path.node.argument.alternate);
        if (!eitherIsSeqExp && !bothAreCondExp) return;

        path.replaceWith(t.ifStatement(path.node.argument.test, this.convertToReturnBody(path.node.argument.consequent), this.convertToReturnBody(path.node.argument.alternate)));
      },
    };
  }

createVisitor = ({ cwd, excludes }: {
  cwd?: string,
  excludes?: (string | RegExp)[],
}): Visitor<PluginPass> => {
  const isExclude = excludes?.length
    ? memo((filePath: string): boolean => pathMatch(filePath, excludes))
    : () => false

  const pathRelative = memo((filePath: string): string => relative(
    cwd ?? process.cwd(),
    filePath,
  ))

  const visitor: Visitor<PluginPass> = {
    JSXOpeningElement: {
      enter(path, state: PluginPass) {
        const filePath = state?.file?.opts?.filename
        if (!filePath) return
        if (isExclude(filePath)) return

        const relativePath = pathRelative(filePath)

        doJSXOpeningElement(
          path.node,
          {
            relativePath,
          },
        )
      },
    },
  }

  return visitor
}

findImportStatement = (program: NodePath<Program>, source: string) => {
    let importStatement: NodePath<ImportDeclaration> | null = null;
    const visitor: Visitor = {
        ImportDeclaration: path => {
            if (path.get('source').node.value === source) {
                importStatement = path;
                path.stop();
            }
        },
    };
    program.traverse(visitor);
    return importStatement;
}

getVisitor(): Visitor {
    return {
      CallExpression: (path) => {
        if (!t.isMemberExpression(path.node.callee) || !t.isIdentifier(path.node.callee.object) || !t.isIdentifier(path.node.callee.property)) return;
        if (path.node.callee.object.name !== 'Math' && path.node.callee.property.name !== 'pow') return;
        if (!t.isExpression(path.node.arguments[0]) || !t.isExpression(path.node.arguments[1])) return;

        path.replaceWith(t.binaryExpression('**', path.node.arguments[0], path.node.arguments[1]));
      },
    };
  }

isFunctionBodyComponentLike = (path: NodePath<FunctionDeclaration>): boolean => {
    let matched = false;
    const visitor: Visitor = {
        JSXElement(path) {
            matched = true;
            path.stop();
        },
        CallExpression(path) {
            const calleeName = resolveCalleeName(path);
            if (KEY_REACT_FUNCTIONS.has(calleeName)) {
                matched = true;
                path.stop();
            }
        },
    };
    path.traverse(visitor);
    return matched;
}

export default function ({ types }: Babel): { visitor: Visitor<PluginOptions>; inherits: unknown } {
  return {
    inherits: babelPluginSyntaxJsx,
    visitor: {
      JSXElement(path) {
        const component = resolveJsxComponent(types, path);

        if (component === 'Svg') {
          // handle svg component
          transformSvgComponent(types, path);
        } else if (component === 'default' || component === 'Img') {
          // handle img component
          transformImgComponent(types, path);
        }
      },
    },
  };
}

getVisitor(): Visitor {
    return {
      CallExpression: (path) => {
        if (!t.isIdentifier(path.node.callee)) return;

        const moduleDependency = this.getModuleDependency(path);
        if (moduleDependency == null) return;

        const varDeclar = path.find((p) => p.isVariableDeclarator());
        const varName = varDeclar?.isVariableDeclarator() && t.isIdentifier(varDeclar.node.id) ? varDeclar.node.id.name : null;

        if (moduleDependency.isPolyfill && varName) {
          this.bindingTraverse(path.scope.bindings[varName], varName, {
            MemberExpression: (bPath) => {
              if (!t.isIdentifier(bPath.node.object) || !t.isIdentifier(bPath.node.property)) return;
              if (bPath.node.object.name !== varName || bPath.node.property.name !== 'default') return;

              bPath.replaceWith(bPath.node.object);
            },
          });
          path.scope.rename(varName, moduleDependency.npmModuleVarName);
          varDeclar?.remove();
          return;
        }

        path.get('arguments')[0].replaceWith(t.stringLiteral(this.generateModuleName(moduleDependency)));
        if (!varDeclar?.isVariableDeclarator()) return;
        if (!t.isIdentifier(varDeclar.node.id)) return;
        path.scope.rename(varDeclar.node.id.name, moduleDependency.npmModuleVarName || `module${moduleDependency.moduleId}`);
      },
    };
  }

_default: () => {
    visitor: Visitor<{}>;
}

getVisitor(): Visitor {
    return {
      ReturnStatement: (path) => {
        const argument = path.get('argument');
        if (!argument.isSequenceExpression() || argument.get('expressions').length <= 1) return;
        const expressions = argument.get('expressions');

        this.debugLog('ReturnStatement:');
        this.debugLog(this.debugPathToCode(path));

        path.insertBefore(this.sequenceExpressionToStatements(expressions.slice(0, -1).map((e) => e.node)));
        for (let i = 0; i < expressions.length - 1; i += 1) {
          expressions[i].remove();
        }
        path.get('argument').replaceWith(expressions[expressions.length - 1]);
      },
      VariableDeclaration: (path) => {
        const declarations = path.get('declarations');
        declarations.forEach((declarator) => {
          const init = declarator.get('init');
          if (!init.isSequenceExpression()) return;

          const validExpressions = init.get('expressions').filter((expression) => {
            if (!expression.isAssignmentExpression()) return true;
            if (!t.isIdentifier(expression.node.left)) return true;

            const matchingDeclaration = declarations.find((declar) => t.isIdentifier(declar.node.id) && declar.node.id.name === (<t.Identifier>expression.node.left).name);
            if (!matchingDeclaration) return true;

            matchingDeclaration.get('init').replaceWith(expression.get('right').node);
            expression.remove();
            return false;
          });

          path.insertBefore(this.sequenceExpressionToStatements(validExpressions.slice(0, -1).map((e) => e.node)));
          for (let i = 0; i < validExpressions.length - 1; i += 1) {
            validExpressions[i].remove();
          }
          declarator.get('init').replaceWith(validExpressions[validExpressions.length - 1]);
        });
      },
      ExpressionStatement: (path) => {
        const expression = path.get('expression');
        if (!expression.isSequenceExpression() || expression.get('expressions').length <= 1) return;

        this.debugLog('ExpressionStatement:');
        this.debugLog(this.debugPathToCode(path));

        path.replaceWithMultiple(this.sequenceExpressionToStatements(expression.node.expressions));
      },
    };
  }

_default: () => {
    visitor: Visitor<{}>;
}

/**
   * Get a visitor that contains the plugin parsing. Use this for simplier plugins.
   * Do not use path.skip() or path.stop() if your plugin uses this method.
   */
  getVisitor?(rerunPlugin: (pluginConstructor: PluginConstructor) => void): Visitor;