Formátovač JSX
Formátujte komponenty React a ďalšie JSX pomocou tohto formátovača JSX. Vložte kód a nástroj ho analyzuje ako modul JavaScript so zapnutým JSX, vypíše JavaScript s odsadením dvoma medzerami a bodkočiarkami a viacriadkové prvky JSX rozloží tak, že vnorené značky budú na samostatných riadkoch v zátvorkách. Chyby syntaxe sa zobrazia, aby vývojári React rýchlo získali prehľadné komponenty na kontrolu, ladenie a dokumentáciu.
Často kladené otázky
Ako funguje formátovač JSX?
Najprv analyzuje kód ako modul JavaScript so zapnutým JSX a vypíše ho v jednotnom štýle. Prvky JSX sa potom rozložia podľa rovnakých pravidiel ako vo formátovači HTML, takže vnorené blokové značky budú na vlastných odsadených riadkoch.
Ako sa zapisujú viacriadkové prvky JSX?
Ak prvok obsahuje blokové potomkovské prvky, napríklad div, section, p, ul alebo h1, každý potomok sa umiestni na vlastný riadok a celý prvok sa uzavrie do zátvoriek. Prvky, ktoré sa zmestia na jeden riadok, napríklad značka jedného komponentu, zostanú vložené v riadku.
Podporujú sa fragmenty a komponenty so samouzatváracou značkou?
Áno, fragmenty zapísané ako <> a </> aj komponenty so samouzatváracou značkou, napríklad <Item key={1}/>, sa analyzujú a zachovajú. Ich atribúty a výrazy v zložených zátvorkách sa skopírujú tak, ako sú zapísané.
Čo sa stane pri chybách syntaxe?
Analyzátor sa zastaví a nástroj zobrazí správu, napríklad o neočakávanom tokene, namiesto toho, aby vrátil čiastočne naformátovaný kód. Opravte označené miesto a spustite formátovanie znova.
Aký štýl používa časť JavaScript?
Bloky sa odsadzujú dvoma medzerami, každý príkaz je na samostatnom riadku, okolo operátorov sú medzery a príkazy sa končia bodkočiarkami. Štýl nemožno meniť.
Zachovajú sa komentáre?
Áno, riadkové aj blokové komentáre v JavaScript sa zachovajú. Komentáre vo výrazoch JSX zostanú v zložených zátvorkách.
Podporuje TypeScript v súboroch TSX?
Nie, typové anotácie nie sú súčasťou gramatiky JSX, ktorú tento nástroj analyzuje, takže TSX s typmi sa odmietne ako chyba syntaxe. Na typovaný kód použite formátovač TypeScript.
Zmení formátovanie spôsob, akým sa môj komponent vykreslí?
JavaScript sa iba znovu vypíše a rozloženie JSX mení medzery medzi blokovými prvkami, ktoré React ignoruje, keď sú na samostatných riadkoch. Ak záleží na presných medzerách, skontrolujte vložený text vedľa značiek.
Prečo je výstup ohraničený ako javascript?
JSX je rozšírením JavaScript, preto sa výsledok vracia ako blok kódu Markdown označený javascript. Skopírujte riadky medzi ohraničeniami do svojho súboru .jsx.
Aký veľký môže byť môj komponent?
Až 5 MB kódu na jedno spustenie; väčší vstup sa odmietne so správou. Výstup je rovnaký ako pri možnosti JSX vo Formátovači kódu.