npm package: @jiniu/apm-log-jiniu
Description: ### 目录结构
Latest version: 0.0.2

# permission-jiniu

### 目录结构

```
├─lib - 打包后的插件目录
│  amp-log-jiniu.js - 插件入口文件
│  amp-log-jiniu.umd.cjs
├─plugins - 插件目录
│ ├─config - 组件目录
│ │ ├─index.ts - md5加盐方式中的盐字符串
│ │ └─Scene.js - 小程序场景值对应的信息
│ ├─directives - 指令目录
│ │ ├─Btnlog
│ │ │ └─index.js - 按钮指令
│ │ └─index.ts - 注册指令，并对外暴漏install方法
│ ├─log - 指令目录
│ │ └─index.js - 日志类，用于发送请求及添加设备及用户相关参数
│ ├─mixin
│ │ └─index.js - 混淆类，用于植入代码，监听路由及用户操作
│ ├─utils
│ │ └─index.js - 工具函数
│ └─index.js- 插件入口文件
├─src - 测试插件的项目代码目录
│ ├─pages - 测试插件的页面代码目录
│ ├─App.vue
│ └─main.js - 项目入口文件
└─package.json - 项目信息，插件信息，打包成插件命令，依赖包信息
```

### 文件内容解析

#### package.json

```
├─package.json
│ ├─"name": "@jiniu/apm-log-jiniu",
│ ├─"version": "0.0.1",  插件版本号
│ ├─"description": "@jiniu/apm-log-jiniu",  插件描述
│ ├─"main": "lib/amp-log-jiniu.js",  插件入口文件(此文件为打包后的插件目录下的入口文件)
│ └─"keywords": ["test"],  插件关键词，用于npm搜索
```

#### [log/index.ts](./plugins/log/index.ts)
| 方法              | 描述                      | 参数                                                                                                         |
| :---------------- |:------------------------|:-----------------------------------------------------------------------------------------------------------|
| constructor       | 类的构造函数，用于实例化的时候，存储相关参数， | args - 配置信息，参考下方插件使用方法                                                                                     |
| initDeviceInfo          | 初始化用户当前浏览网站或小程序端的设备信息，  | -                                                                                                          |
| initTaskQueue | 创建任务并初始化任务队列            | -                                                                                                          |
| isBreak    | 根据项目配置，过滤路由             | (args, content) 接受两个参数：1、页面跳转的相关信息，2、页面跳转的路径                                                               |
| addTask        | 添加任务                    | (actionType, args)接收两个参数:1.用户行为,2.页面跳转的相关信息                                         |

#### [mixin/index.ts](./plugins/mixin/index.ts)
| 方法              | 描述                                                    | 参数                                                                                                                 |
| :---------------- |:------------------------------------------------------|:-------------------------------------------------------------------------------------------------------------------|
| constructor       | 类的构造函数，用于实例化的时候，存储相关信息                                | args - 配置信息，参考下方插件使用方法                                                                                             |
| init          | 根据用户使用平台，初始化相关逻辑                                      | (router)接受一个参数，1、路由对象                                                                                              |
| initRouter | 用户使用浏览器访问平台时，初始化路由                                    | (router)接受一个参数，1、路由对象                                                                                              |
| initUniRouter    | 用户使用小程序时，初始化路由                                        | -                                                                                                                  |
| mountBtnFunction        | 用户使用小程序，点击按钮时，调用此方法                                   | -                                                                                                                  |
| mountExitSystemFunction | 用户使用小程序，退出小程序时，调用此方法                                  | -                                                                                                                  |
| addListener | 添加浏览器标签栏监听事件                                          | -                                                                                                                  |

#### [utils/index.ts](./plugins/utils/DbOperator.js) 
| 方法         | 描述          | 参数                                                                     |
|:-----------|:------------|:-----------------------------------------------------------------------|
| getTime    | 获取时间        | -                                                                      |
| setSession | 设置session数据 | (key, val, uni) 接收3个参数:1.session key,2.value,3.uni对象，小程序端使用此插件时，会传入此参数 |
| getSession | 设置session数据 | (key, uni) 接收2个参数:1.session key,2.uni对象，小程序端使用此插件时，会传入此参数              |
| clearSession | 清除session数据 | (key, uni) 接收2个参数:1.session key,2.uni对象，小程序端使用此插件时，会传入此参数              |
| generateUUID | 生成uuid      | -                                                                      |

### 插件使用方法

**1.安装插件** 在项目根目录下执行 `npm install @jiniu/apm-log-jiniu --save`
**2.引入插件** main.js 中引入插件 `import ApmLogJiniu from '@jiniu/apm-log-jiniu'`
**3.使用插件** 在 main.js 中使用插件 `app.use(PermissionJiNiu, configuration)`
- `configuration`：{} - 为配置参数，配置参数为对象，目前支持的配置参数如下：
    - `router`: 项目中的路由对象
    - `envUrl`: 接口路径
    - `appChannelId`: "",
    - `dataChannelId`: "",
    - `getAccountFn`: 方法，返回用户账号
    - `getNickNameFn`: '' 方法，返回用户nickName

**5.添加指令** 找到按钮 添加自定义指令 v-Btnlog 即可


### 插件使用示例

详情请看 [例子](src/App.vue)

### 插件打包及发布步骤

**1.** 编写好插件代码
**2.** 在项目中测试，可用
**3.** 执行`npm run build-lib`
**4.** 项目根目录执行 `npm whoami` 查看当前`npm`用户名
**5.** 如果 4 执行后，显示用户名，则，执行`npm publish --access public`, 否则执行`npm login`，登录`npm`后，重新在项目根目录执行`npm publish`

### 命令解析

`vue-cli-service build --target lib --name jn-permission-plugin --dest lib plugins/index.js`

- `target lib` // 默认为构建应用，改为 lib 即可启用构建库模式
- `name jiniu-component-library-test` // 输出文件名
- `dest lib` // 输出目录，默认为 dist，这里我们改为 lib
- `plugins/index.js` // 入口文件路径，默认为 src/App.vue，这里改为 plugin/index.js