React / JSX 中推荐的字符行长度答案

【问题标题】：Recomended character line length in React / JSXReact / JSX 中推荐的字符行长度
【发布时间】：2019-02-24 08:32:57
【问题描述】：

我知道 React 社区非常专注于创建良好的模式，并且我一直在 React 论坛、github、文章中搜索，但找不到任何关于 jsx 代码的“optimun”行长度的提及。

鉴于 JSX 是一种不同类型的代码（它包含可能需要更多字符的 HTML 标记），React 社区对此有什么建议吗？

编辑

找到Airbnb React/JSX Style Guide，这似乎很受欢迎，但没有提及行长。我也想知道你的经历。

【问题讨论】：

我使用 100 个字符限制。
这更多是个人选择，您的团队可以达成一致意见。我们的想法是拥有相同的标准代码编写实践。 React Material UI 也使用 100 lineWidth。
我也同意这是个人选择。我只是很好奇 React 社区是否同意某些数量（代码风格的目的）。或者我们很可能对“最佳”数字进行一些研究，因为我们已经研究了标识标签空间数量的最佳数字（涉及人脑等）。

【解决方案1】：

据我所知，React 社区中没有关于JSX 代码行的最大数量事实上的最佳实践。你可以自己调整。

在我们的项目中，我们将一个函数设为大约 20 行。如果JSX代码超过阈值，我们认为组件过于臃肿，并将其重构为更小的组件。

eslint-plugin-react 也值得尝试降低 JSX 代码的复杂性。

【讨论】：

【解决方案2】：

我认为行长没有神奇的数字。我的团队也认为 80 太短，所以我们选择 100。

我会挑选一些东西，看看感觉如何。了解您喜欢什么以及为什么喜欢通常比遵循社区标准更重要。

【讨论】：