关于模块化、组件化的理解

模块化、组件化是一种开发思想,是一种开发思路上的解决方案,咱们大多数人要是没有深刻理解 这个概念的话,会有一种模糊摸不着模块化、组件化意思的感受,会有一种想用模块化、组件化来实现项目殊不知道怎么下手。其实,只要记住,模块化只是一种思想,不是一种具体的解决方案。css

在项目中,咱们可能用到相似bootstrap里的组件(button)同样,咱们把这些组件理解为组件化开发的实现,意识上,咱们大多数人会刻意去区分组件化、模块化,其实这只是咱们中文上去区分,英文上都是model,都只是一种解决思路,不一样的是,需求不一样,实现出来的代码效果也是不一样。举个例子,bootstrap里的button组件,它是有一个独立的可执行的单员,就直接引用,在页面上你就会看到一个button的按钮出现,这也就是所说的颗粒化,而bootstrap里的栅格系统,你不可能单单引用栅格系统的样式类,页面中就会呈现出具体的效果出来,还需依赖一个具体的html标签或者其余的组件,而button组件是不须要依赖其余的组件或者什么的,人们就会惯性的理解成button是一个组件,栅格系统是一个模块,由于button是独立的。其实,他们都同样,只是需求不一样,都是用模块化的思路解决方案。button的需求是开发一个ui组件,栅格系统是开发一个排版布局的布局解决方案。html

事实上,模块化(组件化、模块化总称为模块化吧,不区分了)在咱们实际项目开发上回很经常使用到,容易理解的是开发一个下拉框通用组件这种封装好的组件,难以理解的就是定义一个margin外边距的一系列的属性样式集合,好比margin:10,margin:20,margin:30等,这也是一个模块,定义的一个实现不一样外边距的需求的模块实现。webpack

固然,模块化说了是一种思路,不单单是体如今具体的代码逻辑上,还体如今文件管理上,页面布局等等,好比,webpack模块化管理工具上实现的多个入口的配置,按照页面或者页面中的不一样模块区域对js/css图片等进行压缩整合按照不一样页面呈现、不一样模块区域呈现导入不一样的文件,这也是模块化的思惟。
以上是小可对模块化的一些理解,有错误请江湖上各位好友指正,嘻嘻~多多交流,一块儿成长进步~web

相关文章
相关标签/搜索