Estoy tratando de usar un código escrito en Pug, en una aplicación JS reaccionar.
Encontré este complemento aquí que convertirá el código, pero hay un problema. Indica que no puede convertir "." declaraciones, de las cuales hay algunas.
Entonces, ¿con qué reemplazo los "." para que funcione (o, alternativamente, si alguien pudiera convertirlo para reaccionar JS, sería fantástico!
El código Pug que deseo usar:
- const droplets = 250 .rain - for (let r = 0; r < droplets; r++) svg.rain__drop(preserveAspectRatio="xMinYMin", viewBox='0 0 5 50', style=`--x: ${Math.floor(Math.random() * 100)}; --y: ${Math.floor(Math.random() * 100)}; --o: ${Math.random()}; --a: ${Math.random() + 0.5}; --d: ${(Math.random() * 2) - 1}; --s: ${Math.random()}`) path(stroke='none', d="M 2.5,0 C 2.6949458,3.5392017 3.344765,20.524571 4.4494577,30.9559 5.7551357,42.666753 4.5915685,50 2.5,50 0.40843152,50 -0.75513565,42.666753 0.55054234,30.9559 1.655235,20.524571 2.3050542,3.5392017 2.5,0 Z").rain__dropse analiza en este marcado HTML
class="rain__drop"lo que significaría este JSX:
className="rain__drop"Como regla general, si tiene la posibilidad de ejecutar la aplicación, siempre puede inspeccionar el marcado resultante.
Probablemente útil: Pug: interpolación .
Probablemente aún más útil: PUG to HTML . Consejo: combínelo con HTML para JSX .
Hora de copiar/pegar!