# JSX-formaterare

Formatera React-komponenter och annan JSX med den här JSX-formateraren. Klistra in koden så tolkar verktyget den som en JavaScript-modul med JSX aktiverat, skriver ut JavaScript med två blankstegs indrag och semikolon, och lägger flerradiga JSX-element med nästlade taggar på egna rader inom parenteser. Syntaxfel rapporteras, så React-utvecklare får tillbaka lättlästa komponenter för granskning, felsökning och dokumentation.

## Vanliga frågor

### Hur fungerar JSX-formateraren?

Först tolkas koden som en JavaScript-modul med JSX aktiverat och skrivs ut i en enhetlig stil. JSX-element läggs sedan ut enligt samma regler som HTML-formateraren, så nästlade blocktaggar får egna indragna rader.

### Hur skrivs flerradiga JSX-element?

När ett element innehåller underordnade blockelement, som div, section, p, ul eller h1, placeras varje underordnat element på en egen rad och hela elementet omsluts av parenteser. Element som får plats på en rad, till exempel en ensam komponenttagg, förblir på samma rad.

### Stöds fragment och självstängande komponenter?

Ja, fragment skrivna som <> och </> samt självstängande komponenter som <Item key={1}/> tolkas och bevaras. Deras attribut och uttryck inom klammerparenteser kopieras som de är skrivna.

### Vad händer vid syntaxfel?

Parsern avbryter och verktyget visar felmeddelandet, till exempel en oväntad token, i stället för att returnera halvformaterad kod. Rätta felet på den angivna platsen och formatera igen.

### Vilken stil använder delen JavaScript?

Block får två blankstegs indrag, en sats per rad, blanksteg runt operatorer och semikolon i slutet av satser. Det finns inga alternativ för att ändra stilen.

### Bevaras kommentarer?

Ja, rad- och blockkommentarer i JavaScript bevaras. Kommentarer inuti JSX-uttryck förblir inom sina klammerparenteser.

### Stöder den TypeScript i TSX-filer?

Nej, typannoteringar ingår inte i grammatiken för JSX som det här verktyget tolkar, så TSX med typer avvisas som ett syntaxfel. Använd TypeScript-formateraren för typad kod.

### Kommer formateringen att ändra hur min komponent renderas?

JavaScript skrivs bara ut på nytt, och JSX-layouten ändrar blanksteg mellan blockelement, något som React ignorerar när det står på separata rader. Kontrollera inline-text intill taggar om exakta blanksteg är viktiga.

### Varför omges utdata av en javascript-kodram?

JSX är en utökning av JavaScript, så resultatet returneras som ett Markdown-kodblock märkt javascript. Kopiera raderna mellan avgränsarna till din .jsx-fil.

### Hur stor kan min komponent vara?

Upp till 5 MB kod per körning; större indata avvisas med ett meddelande. Utdata är densamma som JSX-alternativet i Code Formatter.

Vill du annonsera här?

[Mejla oss](mailto:hi@dennn.is?subject=Annonsera%20p%C3%A5%20OneClick%20Pro)

[Annons Pluginpaketet för agenter för WordPress.](https://sleekwp.com/?ref=oneclickpro)