Плагин Babel - Как преобразовать JSX без реакции - PullRequest
0 голосов
/ 09 апреля 2020

Я написал свой собственный модуль, который принимает строку JSX в качестве параметра и превращает ее в javascript объект, поэтому я называю это так:

import parser from 'own-parser'
console.log(parser("<h1>Hello world</h1>"))

Это работает, но то, что я на самом деле необходимо преобразовать JSX в объект при компиляции, чтобы я мог написать его как обычное выражение JSX:

var jsx = <h1>Hello World</h1>

и получить результат из моей функции в виде вывода, например:

var jsx = {element: 'h1', children:[/*...*/]}

Я не понимаю, есть много плагинов babel, таких как "babel-plugin-transform-jsx", которые могут это сделать sh, но я хочу узнать о плагинах babel и о том, как они работают, чтобы я мог сделать свои собственные.

Я пытался проанализировать код упомянутого выше плагина, но все еще не могу понять, как все работает, например, как плагин узнает, что он работает с JSXElement?

Единственное, что Я пытаюсь сделать, это извлечь этот JSX, поместить его в мою функцию и преобразовать его в возвращение функции

Как я могу это сделать? Спасибо

1 Ответ

0 голосов
/ 10 апреля 2020

Я понял, оказывается, вы можете получить код узла с path.toString(), например, чтобы объявить посетителя следующим образом:

JSXElement(path, state) {
  if (path.parentPath.type != "JSXElement") {
     const parsed = parser(path.toString())
     path.replaceWithSourceString(JSON.stringify(parsed))
  }
}

Этого нет в babel Руководство по плагину, я полагаю, что это плохая практика, но в любом случае это быстрое решение на тот случай, если кто-то спросит

...