Question

结构1

reducers
   index.ts //Combine all reducers
   user.reducer.ts
   product.reducer.ts
actions
   index.ts  //Combine all actions
   user.action.ts
   product.action.ts
effects
   index.ts //Combine all effects
   user.effect.ts
   product.effect.ts
selector
   //Combine all selectors
   user.selector.ts
   product.selector.ts

OR

user
  user.reducer.ts
  user.action.ts
  user.effect.ts
  user.selector.ts
product
  product.reducer.ts
  product.action.ts
  product.effect.ts
  product.selector.ts
reducers.ts //Combine all reducers
actions.ts //Combine all actions
effects.ts //Combine all effects
selectors.ts //Combine all selectors

Answer 1

我在应用程序中的几个SMART组件中使用reducer，actions或其他应用时，找到了第一个适合相当小的应用程序的结构。

虽然它促进了关注点的分离，但我发现在各个目录之间跳转相当繁琐。

通常，与user.reducer.ts一起工作将涉及与其他文件一起工作：效果，行动等。所以，第二种方法看起来更整洁。

我想建议一个可能适合的第三个结构，一个跟随＆＃34;桶＆＃34;接近angular2：

- store
    - user
        - index.ts
        - user.actions.ts
        - user.effects.ts
        - user.reducer.ts
        - user.reducer.spec.ts

    // the store definition file - will expose reducer, actions etc..
    // for connecting those to the app in the bootstrap phase
    - index.ts

使用这种结构，用户目录是一个桶，它公开了各种逻辑组件，只需导入用户即可单独导入，即：

import { reducer as UserReducer } from '../store/user'; 
// or
import { UserReducer } from '../store/user'

我在我的开源媒体播放器应用中尝试了这些方法 - Echoes Player - http://github.com/orizens/echoes-player
正如另一条评论所述，应用于回声播放器的这些策略和架构是在ngrx styleguide

中编译的

Answer 2

我遵循本指南以获得最佳ngRx实践和结构：

https://github.com/orizens/ngrx-styleguide

你提到的第二种方式是最好的，因为（引用样式指南）：

DO 在reducer的目录中创建单独的文件：reducer，reducer的spec，reducer的actions和reducer的选择器。最后，使用index.ts作为导出每个文件内容的桶。 为什么？在开发定位每个相关的类/文件时更容易

使用ngrx的应用程序的最佳结构是什么？

2 个答案: