-
Notifications
You must be signed in to change notification settings - Fork 3.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
讨论:dva-cli boilerplate structure #21
Comments
如果只是一个模板的话,我觉得还是全点好,多了删起来简单,但是少了加起来就不太好加=。-,我的建议:
|
有几点和之前不同的是:
|
哦,原来的 antd-init 的 demo 照这个结构有了么 |
@yiminghe 你是指 antd-init 的 demo 也要有这个结构? 那不是只有一个 |
看了下没什么问题。只有一点,我们要不要推荐 containers 这种写法? |
我个人是觉得route component有点歧义,containers虽然好像格调不高,但是表意还是挺清楚的(对于大型应用),entries和routes的设计我个人觉得可以算是给大型设计留入口吧,虽然dva的api和设计思路跟emberjs差不多,但是可能dva以后会更多的用在中后台大型应用中,该留的口子可以先留着 😄 |
routes 目录我们目前系统中是用来放 403 404 之类的 这种应该每个系统都有吧
|
感谢讨论,说下我的理解。
routes 用于存放 router 定义的 component,和 router 对应,可能是 container,也可能是 component。单独启一个 routes 目录存放还有个原因是考虑后续的 fine generator 功能,比如 另外,外层有一个
即:要不要推荐 container 这种写法。先不推荐吧,1 是
我之前也有配 layouts 文件夹的,昨天沉鱼说 layouts 其实也是 components,为何要单独分出来呢? 我想想也是如此,所以就把 layouts 删掉了,放在 components 里名字带上 layout 后缀吧。
这个应该放在 model 下组织吧。
这个其实是看我们的应用大部分是什么类型? 多页面还是单页面。我觉得 80% 应该是单页应用,所以把 index.js 提出来,同时简化了 entries 的概念。多页应用通过文档或者 addon 的方式提供吧。另外以我之前做过的多页(子应用)应用来看,组织其实挺复杂的,可能需要每个页面(子应用)都有自己的 models、components、services,只是有一个 entries 目录并不一定能解决问题,感觉通过文档或其他方式提供建议会更好。 |
是 antd-init redux 那个 demo |
原来 routes 是指 route 对应的 Component,那这样也没问题,从 angular 背景过来很习惯每个路由有一个对应的 template & controller,有点类似这种概念。 |
@yiminghe antd-init 保留最简的 demo 版本,然后引导到 dva-cli 。 |
其实我还是比较赞同 @nikogu 给出的结构的。 我之前的习惯是container + component(用了connect就是container,没用connect就是component),route仅仅包含Router里面的内容,也就是路由结构。所以我还是希望保留container的。 对是否保留entry持中立态度,偏向保留,毕竟对于单页面应用,多一个entry并不会有什么影响。 constants 这个文件夹以前用过但是根本没用起来,不建议。 |
layouts 虽然也是一个组件,但是从工程意义来讲,稳定的布局组件入口让项目比较容易上手。否则可能我都不知道 layouts 是放到 components 下的。 另外还有 tests(测试)、static(静态文件)、styles(全局样式)、utils(通用工具方法) 这些目录也可以考虑下。 |
另外 mock 数据现在都放在 proxy.config.js 这一个文件中?搞一个 mock 目录如何? |
tests 目录 +1 @afc163 mock 目录在外面,proxy.config.js 可以配置是走 mock 还是 redirect 到其他地址 |
改动:
其他:
|
我的建议还是分成 首先先引入一篇文章 Presentational and Container Components, containers从项目架构设计上来说并不是纯粹的components,当然它确实同时也具备components的特征,不过它扮演的角色是关联数据的容器,并且提供处理数据的功能,在dva中数据模型就是model,而components是不需要关心model的,里面的实现也不会跟model挂钩,也不会dispatch,简单的说我认为components的实现就跟antd的组件是一样的,职责单一而聚焦,跟框架无关。 所以区分出containers和components最明显的作用是让项目开发者在 @sorrycc 说的这种情况:
这种情况是可以避免的,比如我之前写的一个项目是这样划分的: 其中 container 扮演的角色就是一切跟model相互关联的操作,而 components 里面都是纯粹的 presentational components,如果在其中的 presentational components 的子组件还会跟 model 有关系,那么这个子组件又会是一个 container。 综上所属,containers 和 components 的区分更多是为了清晰开发者的思路,这样会让数据链路更加清晰。 |
“ In an earlier version of this article I claimed that presentational components should only contain other presentational components. I no longer think this is the case. Whether a component is a presentational component or a container is its implementation detail. You should be able to replace a presentational component with a container without modifying any of the call sites. Therefore, both presentational and container components can contain other presentational or container components just fine ” 看到最后,我感觉作者好像在说“ It's up to you . ” 😏 。。。。然后我就更懵了 |
这篇文章出来好久了,感觉作者观点已变,包括他们的 f8app 都已经是 containers 和 components 混用了。 |
这个问题, @sorrycc 要不就按照你的这个来了,也没什么大问题,确定一下: .
├── /mock/
├── /src/
│ ├── /components/ # React components
│ ├── /models/ # model 信息
│ ├── /routes/ # 路由 Component
│ ├── /services/ # 处理和服务器的交互
│ ├── index.html
│ ├── index.js # 应用入口
│ ├── index.less
│ └── router.js # 路由配置
├── package.json
├── proxy.config.js
└── webpack.config.js |
@nikogu 好的,先用这个吧。用 dva-cli@0.2.0 初始化出来就是这个目录结构。 |
大家看下脚手架的目录应该如何组织? 以下是初始方案。
详见:https://github.com/dvajs/dva-cli/tree/master/boilerplates/app
@ChrisFan @yiminghe @nikogu @afc163
The text was updated successfully, but these errors were encountered: