模块加载器
{
"name": "name",
"path": "/project",
"prefix": "/module-prefix/",
"main": "/module-prefix/main.js",
"store": "/module-prefix/store.js",
"base": true
}
project.json配置
├── index.html // 首先浏览器会加载这个index.html,html里面会引入一个bootstrap.js的文件
├── bootstrap.js // 这个bootstrap.js是之前说的模块加载器打包过后的代码,
│ // 模块加载器会先加载 project.config.js
,得到所有模块的配置.
│ // 然后才开始加载每个项目中的main.js文件,注册应用,注入store.js
│
├── project.config.js // 这个文件存到是该项目的所有模块的配置,是代码自动生成的
│ // 之前有提到过项目配置自动化,是这个项目中唯一动态的文件.
│ // 目的是让模块的配置文件更新,或者新增新模块的时候,模块会自动挂载到项目中来
│ // 他会遍历每一个模块的project.json文件,取出内容,合并到一起
│
├── projectA // 模块A目录
│ ├── asset-manifest.json
│ ├── favicon.ico
│ ├── main.js // 渲染用的出口文件
│ ├── manifest.json
│ ├── project.json // 模块的配置文件
│ ├── static
│ │ ├── js
│ │ │ ├── 0.86ae3ec3.chunk.js
│ │ └── media
│ │ └── logo.db0697c1.png
│ └── store.js //对外输出的store.js 文件
└── projectB // 模块B (重要文件的位置,与模块A是一致的)
├── asset-manifest.json
├── main.js
├── manifest.json
├── project.json
├── static
│ ├── js
│ │ ├── 0.86ae3ec3.chunk.js
│ └── media
│ └── logo.db0697c1.png
└── store.js