React 项目的文件结构中存在许多嵌套路由和组件目录的原因

Question

我正在查看一个无法在此处分享的 react 和 redux 代码库。文件结构具有许多级别的目录，这些目录遵循包含组件目录的路由目录模式，并且该模式以路径重复自身。也就是说，一个典型的路径是app/routes/charts/routes/bar/components/bar.js。在这种情况下， components/bar.js 位于 index.js 文件旁边，这通常是这种情况（但并非总是如此）。由于应用程序有很多元素，目录结构非常繁忙。似乎它都支持某种模块化，但导航有点困难。组件位于递归地包含类似路径一次或多次的路由目录中的事实有点难以理解。我对所有嵌套路由目录的目的也有些困惑。我想知道的是，这是否遵循我可以查找和理解的惯用方法或策略？

Answer 1

不幸的是，唯一能回答这个问题的人是整理文件的人。

它是否有意义取决于实际项目和个人喜好，但我的猜测是应用程序中有一个charts 路由，它有自己的子路由，其中​​一个是bar，它可能不仅需要组件，还需要容器、样式、类型、测试等，因此它有自己的 components 文件夹。

最终，构建目录结构没有正确或错误的方式（在合理范围内）。如果它对您/您的同事有一定的意义并且对您/您的同事有用，那么它是完全有效的。

也许拥有第二个routes 文件夹是多余的，而简单地拥有带有路径名称的子文件夹会更简单，但这并不是一种特别不寻常的安排方式。