我的书签
添加书签
移除书签实现原理
模板转换（wxml）
- 介绍
Antmove在转换模版时会进行替换扩展名、检测wxs、处理标签、处理标签属性等步骤。
- 原理说明
Antmove会在编译时先替换源码模版的扩展名，之后会检测模版中引用的wxs模块转换成支付宝端支持的sjs文件进而引用。当然双端模版标签属性会有不同，Antmove会对标签进行过滤，下面会看到代码示例。
- 代码示例
- 插件代码索引（github 代码链接）
逻辑转换（js）
- 介绍
Antmove对各级接口进行过滤。同时在js文件我们经常会使用到基础库提供的API，Antmove在编译时会在js文件引入‘__antmove/api/index’，该文件提供了经过过滤的api来抹平跨平台差异。
- 原理说明
在编译时Antmove在各级接口引入’__antmove/component/componentClass.js’,对接口对象进行了过滤处理。意思是将接口对象传到我们的过滤工具中，通过我们的工具对生命周期、api、函数、接口对象等进行支持和抹平。
- 代码示例
- 插件代码索引
样式转换（wxss）
- 介绍
Antmove在过滤样式文件时，最大可能的保持了文件的原貌。当然我们也要注意，当从微信转到支付宝时不要使用属性选择器，支付宝端并不支持属性选择器。
- 原理说明
Antmove在改掉文件后缀名（wxss改为acss）后，当判断存在引入的外部样式时会把‘@import’的路径改为支付宝可以识别的路径样式。转换后的app.acss文件还会引入一个全局样式@import “/__antmove/static/app.acss”。
- 代码示例
- 插件代码索引
配置文件转换（json）
- 介绍
对于json我们主要对配置做了处理，转换成了支付宝小程序可识别的配置。
- 原理说明
Antmove利用编译时文件对象进行配置名称的替换，同时对usingComponents的路径进行了处理。
- 代码示例
- 插件代码索引
API 运行时处理
- 介绍
在小程序中，我们时一定会用到提供的API。但可使用的开放能力和API命名等都有所不同。Antmove利用过滤文件进行了支持与抹平
- 原理说明
在用到api的脚本，Antmove会引入‘const _my =reqiure(“/__antmove/api/index.js”)’，引入文件对所用到的api做了过滤处理，当用到支付宝端不支持的api或者api属性、返回值等，Antmove都会进行警告等处理。原本的 ‘_my.xxx’ 相当于 ‘my.xxx’ 。
- 代码示例
- 插件代码索引
https://github.com/ant-move/Antmove/tree/master/packages/%40antmove/wx-alipay-plugin/\_\_api
页面和自定义组件运行时处理
- 介绍
Antmove对组件、页面、全局的接口对象进行了转换，对生命周期、事件、observer、relations、behavior等进行了支持和抹平
- 原理说明
在编译时，Antmove对各js文件进行甄别，确定各级接口分别引入接口对应的过滤文件。在运行时，过滤文件和把接口对象中的各个对象进行处理，在页面渲染前会对behavior，relations等进行预处理。之后会对各生命周期用到的功能进行支持和抹平。
- 代码示例
- 插件代码索引
自定义封装组件处理（custom-map）
- 介绍
平台间的组件能力也有差别，例如map组件。Antmove选择自定义封装组件来处理类似问题。
- 原理说明
组件不支持的属性和返回值会利用api和自定义逻辑来抹平，如果开放能力不允许会进行警告等处理方式。
- 代码示例
- 插件代码索引
https://github.com/ant-move/Antmove/tree/master/packages/%40antmove/wx-alipay-plugin/component
