76 lines
2.4 KiB
Markdown
76 lines
2.4 KiB
Markdown
|
# 微应用模板说明文档
|
||
|
|
|
||
|
|
## 在线文档
|
||
|
|
|
||
|
|
https://www.yuque.com/buhangjiecheshen-ymbtb/qc0093/gxdun1dphetcurko
|
||
|
|
|
||
|
|
|
||
|
|
## 安装依赖
|
||
|
|
项目依赖可通过 **yarn** 或 **npm** 进行安装：
|
||
|
|
|
||
|
|
```bash
|
||
|
|
# 使用 yarn
|
||
|
|
yarn
|
||
|
|
|
||
|
|
# 或使用 npm
|
||
|
|
npm i
|
||
|
|
```
|
||
|
|
|
||
|
|
## 开发服务&打包应用
|
||
|
|
|
||
|
|
```bash
|
||
|
|
# 启动开发服务
|
||
|
|
yarn serve:<env>
|
||
|
|
# 或
|
||
|
|
npm run serve:<env>
|
||
|
|
|
||
|
|
# 开发环境打包
|
||
|
|
yarn build:<env>
|
||
|
|
# 或
|
||
|
|
npm run build:<env>
|
||
|
|
```
|
||
|
|
|
||
|
|
## 路由配置&路由访问&自动化路由
|
||
|
|
所有页面必须放在`src/pages/container`目录下，启动访问页面请在浏览器地址栏输入`/<appIdentifier>/container/<你的路由页面文件名称>`
|
||
|
|
解释：
|
||
|
|
1. 所有页面组件命名为`index.js`或`index.jsx`，必须放在一个首字母大写的文件中。
|
||
|
|
2. `container`为固定路径访问格式
|
||
|
|
3. `<appIdentifier>`为应用的唯一标识符，也是应用路由的`basename`，在底座中用于区分其他应用。可在根目录 `jjb.config.js` 文件的 `appIdentifier` 节点中进行修改。
|
||
|
|
4. 自动化路由将根据`pages/container`中的路由页面文件自动生成路由树。
|
||
|
|
5. `id`匹配路由，文件夹命名`_id`
|
||
|
|
|
||
|
|
## 应用接口环境配置
|
||
|
|
应用接口环境相关配置在根目录 `jjb.config.js` 文件的 `environment` 节点中进行定义。
|
||
|
|
|
||
|
|
## 应用开发服务配置
|
||
|
|
应用开发服务相关配置在根目录 `jjb.config.js` 文件的 `server` 节点中进行定义。
|
||
|
|
|
||
|
|
## Babel 配置
|
||
|
|
应用的 `Babel` 配置在根目录 `jjb.babel.js` 文件中进行管理。
|
||
|
|
|
||
|
|
## 目录说明
|
||
|
|
|
||
|
|
1. `src/api/` 配置各个 store 模块的接口数据。
|
||
|
|
2. `src/components/` 全局公共组件。
|
||
|
|
3. `src/enumerate/` 全局各种枚举配置。
|
||
|
|
4. `src/pages/` 页面文件目录。
|
||
|
|
5. `src/main.js` 应用的入口文件。
|
||
|
|
|
||
|
|
## 核心依赖
|
||
|
|
1. `@cqsjjb/jjb-common-decorator`
|
||
|
|
1. 公共装饰器库，内部包含：
|
||
|
|
1. 按钮权限处理
|
||
|
|
2. antd/Table 控制
|
||
|
|
3. 文本重命名处理
|
||
|
|
4. 具体使用方式可参考各个模块的 `d.ts`。
|
||
|
|
2. `@cqsjjb/jjb-common-lib`
|
||
|
|
1. 公共工具库，具体 API 使用请查看 `d.ts`
|
||
|
|
3. `@cqsjjb/jjb-dva-runtime`
|
||
|
|
1. 核心运行时，基于 `dvajs` 实现。
|
||
|
|
1. 应用核心依赖模块
|
||
|
|
2. 应用的自动化路由
|
||
|
|
3. `store` 模块接口数据处理
|
||
|
|
4. 均基于此依赖实现，具体使用方式请查看 `d.ts`。
|
||
|
|
4. `@cqsjjb/jjb-react-admin-component`
|
||
|
|
1. 公共组件库，具体组件使用方式请查看 `d.ts`。
|