react-native项目/目录结构设置

Question

我在windows环境中学习react-native(android).我已经设法在android上启动一个项目(即使他们只支持苹果).在深入研究代码/学习之前,我想要为项目命名良好的文件和文件夹结构.我想事先组织一些事情.谁能帮我？

防爆.对于html之类的东西

www
 |-js
 |-css
 |-img
build
 |-js
 |-css
 |-less
...

react-native init结构有类似的东西

android
node_modules
package.json
index.android.js
...

Answer 1

我建议使用Flux或类似的东西,然后将actions/stores/dispatcher /等放在他们自己的文件夹中.这是我的app结构:

Answer 2

我认为提问者已经解决了这个问题.但我正在为React Native的新人写作.

正如React Native官方网站所指定的那样,我们不需要像IOS和Android那样关注不同平台的文件/目录结构.

例如,您可以在项目中包含以下文件:

BigButton.ios.js
BigButton.android.js

因此,我们可以根据我们真棒应用的逻辑构建和组织我们的文件.例如; 我们可以创建一个名称screens或views文件夹的文件夹.然后,我们可以把我们的登录界面login.ios.js,login.android.js以及lock.png(也许会有另外lock@2x.png文件)文件到为文件夹名为login这将我们在创建screens文件夹.(为了示例,我分隔了登录js文件).

因此,目录组织如下所示;

AwesomeProject\android\..
AwesomeProject\ios\..
AwesomeProject\screens\login\login.android.js
AwesomeProject\screens\login\login.ios.js
AwesomeProject\screens\login\lock.png

事实上,我们的组织screens(或视图)文件夹的结尾非常类似于在Web应用程序中查看MVC结构的一部分.

我希望这有帮助.

PS:我不知道@ eyal83提到的Flux是什么.这可能是更好的解决方案.

编辑

我搜索了一些应用程序架构库.根据我的搜索,在开发复杂的应用程序时,使用Flux或其衍生产品将是有益的.

所以,@ eyal83是对的.(我已经增加了答案+1)

Flux网站:Github - 主页

一些流行的Flux衍生物/类似框架;

Redux .....: Github - 主页 - 由其创作者开设的免费课程

MobX .........: Github - 主页

反流.....: Github

Alt ...........: Github - 主页

Flummox: Github - 主页

Yahoo/Fluxible: Github - 主页

Nuclear-js ..........: Github - 主页

最近,我一直在努力学习其中一个.