Reactjs React中命名和组织子组件（子文件夹）的推荐方法

假设我正在构建一个显示用户配置文件/设置页面的页面。它可能有配置文件的组件、配置文件照片、生物部分等

我目前有以下结构

components/
    |- profile/
        |- profile.jsx
        |- profile_photo/
            |- profile_photo.jsx
            |- edit_button.jsx
            |- edit_modal.jsx
        |- user_bio/
          |- user_bio.jsx
          |- education.jsx
          |- demographics.jsx

是否有社区推荐的方法来组织和命名这些文件

现在，由于我调用

components/profile/profile.jsx

或

components/profile/user\u-bio/user\u-bio.jsx

，路径感觉多余。每个子目录下的“主文件”是否应命名为与文件夹相同的名称，或命名为类似

index.jsx

的通用名称？还是刚刚接受了裁员

考试去哪里？它们与文件放在同一个文件夹中（如Golang的标准）还是放在单独的顶级

tests/

目录中（如Ruby on Rails项目）

---

谢谢

react项目的结构有不同的方法

React建议是

您还可以阅读以下内容：

---

我想说，按功能分组最适合大型项目，按文件类型分组更适合小型项目

您可以创建一个

index.js

文件并导出该文件。让我们以

profile

组件为例。

index.js

文件如下所示：

export {default} from "./profile"

---

因此，您只需使用

components/profile

而不是

components/profile/profile.js

导入

components/profile

是否会自动查找

components/profile/index.js

？如果是这样的话，如果扩展名是

index.jsx

？@user2490003 yes和yes，它还会工作吗