在 IDE JetBrains WebStorm 中正确格式化函数参数的解压缩对象属性

Question

我使用 JetBrains 的 IDE PhpStorm，其中还包括 WebStorm。

编写 React/Next.js 应用程序时，通常需要解包函数参数的对象属性。

但目前 IDE 打乱了属性的形成，如果它们在多行中。

期望的输出：

export default function SomeComponent({
  children,
  home,
}: SomeComponentProps) {
  return (
   <>Something...</>
  );
}

但是实际输出，如果我使用重新格式化：

export default function SomeComponent({
                                         children,
                                         home,
                                      }: SomeComponentProps) {
  return (
   <>Something...</>
  );
}

在 IDE 设置中，我使用 Google JavaScript 样式指南 JavaScript 和 TypeScript：

在一个 Next.js 项目中，我尝试了 ESLint 和 prettier 的组合：

{
  "extends": [
    "eslint:recommended",
    "google",
    "next/core-web-vitals",
    "prettier"
  ],
  "rules": {
    "require-jsdoc": "off"
  }
}

有没有办法存档所需的输出？

Answer 1

请尝试在设置中为函数声明参数禁用多行对齐 |编辑|代码风格 | JavaScript |环绕和大括号

在 IDE JetBrains WebStorm 中正确格式化函数参数的解压缩对象属性

Correctly format unpacked object properties of function parameters in the IDE JetBrains WebStorm

javascript

typescript

webstorm

prettier