Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Como usar o Pug ao invés do JSX?

Referente ao curso React parte 1: componentes reutilizáveis para sua webapp

por Vagnerlandio Nunes
| 115.5k xp | 12 posts

Olá,

Como posso usar a syntax do Pug ao invés do código em JSX?

JSX

<div className="pure-g">
    <div className="pure-u-1-3">
    <p>Thirds</p>
    </div>
    <div className="pure-u-1-3">
    <p>Thirds</p>
    </div>
    <div className="pure-u-1-3">
    <p>Thirds</p>
    </div>
</div>

Pug

.pure-g
    .pure-u-1-3
        p Thirds
    .pure-u-1-3
        p Thirds
    .pure-u-1-3
        p Thirds

Com Pug o código é muito mais legível.

Matricule-se agora e aproveite até 50% OFF

O maior desconto do ano para você evoluir com a maior escola de tecnologia

QUERO APROVEITAR
1 resposta
solução!
por Matheus Henrique Castiglioni
| 5308.1k xp | 9007 posts
Instrutor

Fala aí Vagnerlandio, tudo bem? Para usar o Pug com React você pode utilizar um plugin do Babel:

https://github.com/pugjs/babel-plugin-transform-react-pug

Basicamente você faz a instalação dele e no seu .babelrc adiciona no array de plugins:

{
    "plugins": [
        // ... outros plugins
        "transform-react-pug"
    ]
}

Espero ter ajudado.