代码结构：扁平还是树形？用于反应组件

Question

我正在为我的 React 应用程序设计目录结构。我想知道我是否应该把它做成一棵像

这样的树

|-component
  |-layout
  | |-BaseLayout
  | |-AdminLayout
  | |-UserLayout
  |-page
    |-Home
    |-Upload

或者我应该把结构做成这样。

|-component
  |-BaseLayout
  |-AdminLayout
  |-UserLayout
  |-Home
  |-Upload

哪一个更具可扩展性？

Answer 1

在react官方文档中：

If you’re just starting a project, don’t spend more than five minutes on choosing a file structure. Pick any of the above approaches (or come up with your own) and start writing code! You’ll likely want to rethink it anyway after you’ve written some real code.

文件结构更多的是关于代码的可读性。在您的情况下，第一种方法更具可读性，因为您正在为主要组件创建子目录，使其更加简洁易懂。这是一本关于我们应用程序文件结构的好书： How to better organize your React applications

代码结构：扁平还是树形？用于反应组件

Code structure: flat or tree? for react components

reactjs

directory-structure