JSX 格式化工具
使用此JSX格式化工具格式化React组件和其他JSX。粘贴代码后，工具会将其解析为带有JSX的JavaScript模块，以两个空格缩进和分号输出JavaScript，并将多行JSX元素排版为嵌套标签各自占一行、整体置于圆括号内。工具会报告语法错误，让React开发者能快速获得易读的组件，用于评审、调试和编写文档。
常见问题
JSX格式化工具如何工作？
它首先会在启用JSX的情况下，将代码解析为JavaScript模块，然后按统一样式输出。JSX元素的排版规则与HTML格式化工具相同，因此嵌套的块级标签会各自缩进并单独占行。
多行JSX元素如何编写？
如果元素包含 div、section、p、ul 或 h1 等块级子元素，每个子元素都会单独占一行，整个元素会用圆括号包裹。对于能放在一行内的元素（例如单个组件标签），则保持行内排版。
支持片段和自闭合组件吗？
支持，<> 和 </> 形式的片段以及<Item key={1}/>等自闭合组件都可以解析并保留。它们的属性以及花括号内的表达式都会按原样复制。
遇到语法错误会怎样？
解析器会停止，工具会显示错误信息（例如意外的标记），而不会返回格式化了一部分的代码。请修正报错位置后重新格式化。
JavaScript 部分使用什么样式？
代码块缩进两个空格，每行一条语句，运算符两侧留空格，语句末尾加分号。样式没有可更改的选项。
注释会保留吗？
会保留JavaScript中的行注释和块注释。JSX表达式内的注释会保留在花括号中。
TSX文件中的TypeScript支持吗？
不支持，此工具解析的JSX语法不包含类型注解，因此带有类型的TSX会被视为语法错误并拒绝处理。请使用TypeScript格式化工具处理带类型的代码。
格式化会改变组件的渲染效果吗？
工具只会重新输出JavaScript，JSX布局会更改块级元素之间的空白，而React会忽略单独成行元素之间的空白。如果标签旁的行内文本对间距有精确要求，请检查格式化结果。
为什么输出会用 javascript 代码围栏包裹？
JSX是JavaScript的扩展，因此结果会以标记为 javascript 的Markdown代码块返回。复制围栏之间的代码行，粘贴到你的 .jsx 文件中。
组件最多可以有多大？
每次运行最多可处理 5 MB 代码；超过此大小的输入会被拒绝并显示提示。输出与 Code Formatter 的JSX选项相同。