我是怎样组织react & redux项目的

159 阅读2分钟

译者:your_nick_name_1515981839135

原文链接


#我是怎样组织react & redux项目的

在这篇文章中,我会和你们分享我我是怎样组织react & redux项目,讨论一些在过去两年工作时间我做过的一些抉择 About two years ago the most popular structure to React projects was very similar to this one.: 两年前最受欢迎的React组织结构和这样非常相似:

初始化结构目录 结构按功能对每个文件进行分组,Actions 在action文件夹里面,Reducers在reducer文件夹里面,Tests在tests文件里面.....。这是一种对这些功能快速组织的方法,特别是在你刚接触新项目而不知道该把功能模块往哪放的时候。但是这份结构也有问题,没有很好的复用性(比如在另外一份项目里用React或在移动端APP上使用React Native) 所以为了重用部分逻辑,比如需要在每一个功能函数里面添加的支付功能,将相应的文件和测试移动lib里面,我怎样解决这个问题呢? 时间回到那个时代,对于我和很多开发者来说,移动这些文件在各自的作用域内,保持测试在接近他们的地方,比如这样。

完美看起来,问题已经解决了,这 我认为视图层(visual components/dumb components)并不在范围之内,因为视图只是只是当数据展示给用户时候的一个装饰,在很多地方我想重用一个模块但不是视图,对我来说视图依赖是独立的而不应该和逻辑耦合,对于重用这是最好的。 然后,我提取视图并在src下建立_components_文件夹,然而好像并没有相应的功能函数在同级目录下,所以有时候我需要创建一些测试utils,也必须放在src下,但是现在的文件目录太混乱了,因此,我决定创建modules把一些逻辑放在里面。

我认为另一个重要点就是关心_screens_ folder,但是为什么你提取页面组件,如果他们也是组件呢。 答案是因为组件文件夹是用于可重用的可视组件,而不是与当前应用程序非常耦合 utils文件夹用于保留一些可以从代码提取的逻辑,但不是关于应用范围。 如果你有一些不同的看法 Thanks for your time!

Thanks to José Roniérison and Lucas Monteiro.