我应该如何组织我的申请？

Question

我目前正在做一个 React/TypeScript 项目，并将我的文件分成几个文件夹。我的项目是交互式解决数独问题，使用各种处理方法，所以我将我的应用程序拆分为以下结构：

sudokusolver/
    css/
    dist/
    fonts/
    img/
    js/ -> external libraries, ie. jquery, etc.
    node_modules/
    server/ -> fetches puzzle data from the server
    ts/
        actions/ -> user actions stored for history navigation
        components/
        containers/
        enumerations/
        models/ -> stores multiple actions for history navigation
        solver/ -> sudoku solving methods
        index.tsx
    index.html
    package.json
    ...

现在，我的 components/ 和 containers/ 文件夹变得相当大。我想知道我应该遵循什么方案来重组我的文件结构，知道这是一个单页应用程序。任何帮助将不胜感激。

Answer 1

从你发布的内容来看，你的 component 和 container 文件夹是扁平的 - 我认为这不是个好主意 - 如你所说，它会导致相当长的时间文件夹。

我的一个个人项目具有以下布局。在组件下，我有所有可重用的组件和组件。它们或多或少是任意嵌套的——我将在模式、布局、表单等下有一个 "game" 文件夹——只是为了帮助解决混乱问题。 "Containers"（据我了解）在 "routes," 下，它们的文件夹结构遵循它们再次加载的 URL 路径（/profile/games 使用 containers/wrapper 来自routes/profile/games/...)

在我看来，它也有助于移动与项目构建无关的所有内容（即除了 webpack 定义、npm 的 package.json、gulpfiles、(babel/eslint/tslint)rc 文件之外的所有内容，等）放入子文件夹 - src 或类似文件夹。

我还会拆分您的服务器和客户端应用程序 - 它们不需要位于同一文件夹下。我通常会做类似

的事情

projectname/
    project_client/
        # client src
    project_server/
        # server src

这将有助于减少混乱。

我应该如何组织我的申请？

How should I organize my application?

reactjs

single-page-application

organization