如何阻止IntelliJ/WebStorm将TSX/JSX与左括号置于同一行？

先明确需求和当前格式化的差异：

期望格式：

return (
  <header>
    <nav>...</nav>
  </header>
)

格式化后不符合预期的格式：

return(<header>
    <nav>...</nav>
  </header>)

按照以下步骤调整IDE设置：

1. 打开设置面板

   • 快捷键：Windows/Linux用 Ctrl+Alt+S，Mac用 Cmd+,；或通过菜单栏 File > Settings 打开

2. 导航到TypeScript代码风格设置

   • 依次展开 Editor > Code Style > TypeScript

3. 调整return语句的括号换行规则

   • 切换到 Wrapping and Braces 标签页
   • 找到 Function return statements 区域：
     • 将 Wrap 选项设置为 Wrap always（强制换行，不受语句长度影响）
     • 勾选 Place '(' on new line 选项，确保return关键字后的左括号单独占一行

4. 调整JSX闭合标签与括号的位置

   • 切换到 JSX 标签页
   • 找到 Closing tag placement 选项，选择 On separate line，让JSX闭合标签和末尾的右括号各占一行

5. 禁用Prettier（未安装可跳过）

   • 导航到 Languages & Frameworks > JavaScript > Prettier
   • 取消勾选 On code reformat 和 On save，避免Prettier覆盖IDE自带格式化规则

设置完成后，用快捷键 Ctrl+Alt+L（Windows/Linux）或 Cmd+Opt+L（Mac）重新格式化代码，即可得到期望的格式。

内容的提问来源于stack exchange，提问作者ThomasG2201