react-native - 制作项目结构的最佳实践 - React Native

Question

关闭。这个问题不满足Stack Overflow guidelines .它目前不接受答案。












想改善这个问题吗？更新问题，使其成为 on-topic对于堆栈溢出。

去年关闭。




Improve this question




我根据客户要求创建了新的 React Native 项目。我有知识，但还没有完成任何项目，所以请给我任何项目结构如何构建
这个项目。

或者给我任何 git hub 链接

谢谢

Answer 1

在您的场景中，您可以创建自己的文件夹结构，或者我有一些我自己遵循的示例。

类型与功能

按类型分隔意味着我们按类型组织文件。如果是组件，则有容器和展示文件。如果是 Redux ，还有行动 , reducer , 和 店铺 文件。如果是查看 ，还有 JavaScript , HTML , 和 CSS 文件。

src
  app
    api
    assets
    redux
        actions
        reducers
        store
    components
    containers
    navigation
    styles
    utilities

src/

所有文件都在这个基本组件内。

api/

该文件夹包含与外部 API 通信相关的逻辑，它包括:

常量.js - 存储所有必需的静态值的地方。

helper.js - 用于存储可重用的逻辑。

单个特征文件 — 每个功能文件都包含特定功能的 api 通信逻辑。

Assets /

顾名思义，它包含应用程序中使用的静态文件(例如图像)。

redux/

如果您使用 react-redux，这将保存所有 redux 文件。用于管理状态。在 redux 文件夹中，您有操作、reducers、store 可以轻松管理您的 redux 文件

还原/ Action

围绕 redux 使用的所有操作文件都放在这里。

redux/reducers

围绕 redux 使用的所有 reducer 都放在这里。

redux/商店

你可以把你的商店放在这个 redux store 文件夹中。

组件/

跨功能使用的共享组件放置在此目录中。此类示例(如上所示)是 layout组件，用于包装应用程序组件并确定其整体布局。

容器/

您可以将所有基于屏幕的组件放在此处(例如 - SplashScreen、HomeScreen)。

导航/

您的项目基础导航在这里。您可以创建堆栈导航器并将其导出到您的应用程序。

款式/

如果您在项目中定义了全局样式，则可以将其放在此处，例如颜色、字体样式等。

实用程序/

你可以把 utils 文件放在这里。

注意:此结构基于我的经验。经验丰富后，您可以创建自己的结构

也引用这些链接

https://medium.com/the-andela-way/how-to-structure-a-react-native-app-for-scale-a29194cd33fc

https://www.freecodecamp.org/news/how-to-structure-your-project-and-manage-static-resources-in-react-native-6f4cfc947d92/

https://github.com/asimolmez/react-native-folder-structure

https://github.com/thecodingmachine/react-native-boilerplate