Acorn / JSX - обход узлов с определенным типом

Я разбираю JSX (компонент React), чтобы найти все узлы, которые:

  • принадлежать JSXTextтип
  • У узла есть не пустой параметр

Это моя первая попытка разобрать исходный файл компонента с тестом, как получить Literalузел.

      const acorn = require("acorn")
const jsx = require("acorn-jsx")
const cf = require("acorn-class-fields")
const walk = require("acorn-walk")

let s = acorn.Parser.extend(cf).extend(jsx()).parse(cnt, {ecmaVersion: "latest", sourceType: "module"});
 walk.simple(s, {
Literal(node) {
                        console.log(`Literal: ${node.value}`)
                    }
})

Вопрос

  • Я нашел здесь типы узлов, но типов узлов JSX нет - где их можно найти?
  • Как фильтровать узлы с непустыми textпараметр?

1 ответ

Я верю, что вы можете продлить acorn-walkвключить дополнительные типы.

У меня работает этот плагин: https://github.com/sderosiaux/acorn-jsx-walk

На момент написания статьи я бы реализовал это следующим образом:

      

const acorn = require("acorn");
const jsx = require("acorn-jsx");
const walk = require("acorn-walk");
const { extend } = require('acorn-jsx-walk')

// setup
const parser = acorn.Parser.extend(jsx());
extend(walk.base);

// parse
const ast = parser.parse(cnt, { ecmaVersion: "latest", sourceType: 'module' });


// analys
walk.simple(ast, {
    JSXText(node) {
        console.log(node.expression)
    }
});

Другие вопросы по тегам