Vuex中modules的初始化过程分析

modules作用

• Store作为一个数据“仓库”，存储数据，若应用变得复杂要处理的数据过多，全部放到一个state下就很麻烦。
• modules就是将store拆分成众多具有完整结构的“子仓库“，每个module也可以添加子module，从而形成一个树状结构。方便管理数据。
• 最外层的module可以理解为根 rootModule

modules的初始化

关键点

1. this._modules = new ModuleCollection(options) //Store中的_modules是modules集合
2. module_collection中定义register()方法来构建modules结构
3. installModule(this, state, [], this._modules.root)// 初始化rootModule、注册所有子module
4. makeLocalContext() // 重写dispatch和commit方法，利用namespace拼接type重新得到新type值（类似于绝对路径）
5. resetStoreVM() // 将state成为响应式对象

建立模块的结构

register (path, rawModule, runtime = true) {
   
    if (process.env.NODE_ENV !== 'production') {
   
      assertRawModule(path, rawModule)
    }
    const newModule = new Module(rawModule, runtime)  //新module实例  rawModule是配置项
    if (path.length === 0) {
      
      this.root = newModule   //拿到根 rootModule
    } else {
   
      const parent = this.get(path.slice(0, -1))
      parent.addChild(path[path.length - 1], newModule) //添加子module
    }
    // register nested modules
    if (rawModule.modules) {
   //如果当前module中配置了子module 则遍历并逐一注册
      forEachValue(rawModule.modules, (rawChildModule, key