# MTL集成文档

**mtl-js-sdk.js** 是一个轻量的JavaScript库，包含了丰富的API并具有扩展性，解决跨端。

<br />

## 1. 引入方式

- 本地文件：通过import在项目入口文件处引入 `import'文件路径/mtl.(min.)js'`
- cdn地址：通过script标签引入静态资源 `<script src="文件路径/mtl.(min.)js">`
- npm：通过npm方式，`npm i mtl-js-sdk`安装依赖，然后通过 `import mtl from "mtl-js-sdk"` 的方式引用

```javascript
// 方式一：本地文件引入方式
// 1. 在 https://npmmirror.com/package/mtl-js-sdk/home 地址获取指定版本的MTL
// 2. 找到 dist/mtl.min.js 将文件放在业务项目指定目录下
// 3. 使用以下方式引入
import mtl from "xx/mtl.min.js"


// 方式二：cdn地址引入
// 正式版地址
<script type="text/javascript" src="https://design.yonyoucloud.com/library/mtl/release/mtl.min.js"></script>
// beta版本地址
<script type="text/javascript" src="https://design.yonyoucloud.com/library/mtl/beta/mtl.min.js"></script>
// 流水线地址（支持私有化）
<script type="text/javascript" src="${domain.url}/library/mtl/beta/mtl.min.js"></script>


// 方式三：npm
> npm i mtl-js-sdk
// 文件中引入
import mtl from "mtl-js-sdk"
```

> **mtl 其他版本可在 https://www.npmjs.com/package/mtl-js-sdk?activeTab=versions 查看**

<br />


#### 注意

- <font color='#e23'>在线地址加载的 mtl.js 会在 window 对象上挂 mtl 对象，而本地 import 来的 mtl.js 是根据 from 前定义的名称来决定统一输出的对象，因此在使用时需要注意 mtl 对象的来源。</font>
- <font color='#e23'>mtl 多版本覆盖逻辑是按照版本号比对后，**优先加载版本号最大的，也就是最新的 mtl**。</font>

<br />

## 2. 调用方式

mtl.(min).js 文件会向全局注入 mtl 对象，所有 mtl 的 api 都注册在 mtl 对象下面。因此通过mtl.apiName的方式进行调用。

例如：

```javascript
// 扫描二维码
mtl.scanQRCode({
  scanType: ["qrCode", "barCode"],
  needResult: 1,
  success: function(res) {
    var result = res.resultStr;
  },
  fail: function(err) {
    var message = err.message; // 错误信息
  }
});
```

关于MTL  JS的版本：

1. mtl-js-sdk.js 的新版本默认发布到npm上，然后通过同步逻辑 ynpm 上，开发者通过 npm 或 ynpm 依赖保证版本更新
2. 可以到[mtl-js-package](../record/production-release)地址，查看版本更新情况，下载 mtl.js 文件以及其他插件js文件