前端模块化，基础组件和业务组件的区分

前言

最近做的项目整个感觉就很混乱，经常性的c+v，个人认为写代码就必须拥有很强的复用性，最近思考了许久，当前我们做的项目最缺少的就是模块化，及业务和基础的区分。

模块化是一种思想, 是将大工程拆成小的模块分治的思想.

日常理解的模块化个人认为好比是工厂里的流水线，每一条流水线都有它各自的职责，
好比写function一样一个功能一个函数，可每个模块之间又有共同的地方，这就是后头的组件化了。

由于当前项目使用的是angular，所以接下来的都是基于angular来说的。现今的各种框架大多都是SPA(single-page application),都是通过路由去加载相应的页面，我首先要说的就是依据路由来很好的区分各个板块，也更好的区分业务组件及基础组件。举个列子:

这是项目中大概的几个模块，我当前的路由也是按照当前的几大板块去区分的，而页面我们又为了简洁易于编写代码，将代码又拆分成了多个组件，而有个问题就在于当前所有的组件并未区分，有些组件是所有板块都要用的，有些是只有某一个板块才需要用到的。所有板块都可能用到的就称之为基础组件，而某个板块下用到的称之为业务组件。而我们日常module都会使用到懒加载预加载或是直接在页面加载的时候就直接加载。我们当前的项目对业务及基础的概念就很混淆，都是很随意的加载。这样肯定是不对的，导致现在几乎全部的东西都是全部一次性加载进来了，就失去了模块化的意义了。
而业务组件和基础组件的区分应该设计及开发初期就应该确认好的，而不是等到开发过程中或开发完了之后去优化，后期优化会遇到很多问题。比如代码合并问题、多人开发导致的问题等
还有就是css的基础及业务的区分，我们现在所有的css都是按照组件写的，完全没有这两者的区分，这是我们当前项目的大问题，有通用的样式的很多时候都是直接import文件进来，导致打包之后很多重复的内容。

总结

将css，和组件做出基础及业务的区分， 而组件的加载随着模块化去加载。有什么不对请大神们广提意见…