移动前端学习笔记（4）——zepto定制

Zepto是一个轻量级的针对现代高级浏览器的JavaScript库， 它与jquery有着类似的api，在用法上和jQuery差不多，但它更多的用于移动前端开发，例如zepto的touch模块支持zepto.js封装的常用的触屏事件。

Zepto是分模块引入的，在zepto中文文档 https://www.html.cn/doc/zeptojs_api/ 中它有以下这些模块：

module	default	description
zepto	✔	核心模块；包含许多方法
event	✔	通过on()& off()处理事件
ajax	✔	XMLHttpRequest 和 JSONP 实用功能
form	✔	序列化 & 提交web表单
ie	✔	增加支持桌面的Internet Explorer 10+和Windows Phone 8。
detect		提供 $.os和 $.browser消息
fx		The animate()方法
fx_methods		以动画形式的 show, hide, toggle, 和 fade*()方法.
assets		实验性支持从DOM中移除image元素后清理iOS的内存。
data		一个全面的 data()方法, 能够在内存中存储任意对象。
deferred		提供 $.Deferredpromises API. 依赖"callbacks" 模块.  当包含这个模块时候, $.ajax() 支持promise接口链式的回调。
callbacks		为"deferred"模块提供 $.Callbacks。
selector		实验性的支持 jQuery CSS 表达式 实用功能，比如 $('div:first')和el.is(':visible')。
touch		在触摸设备上触发tap– 和 swipe– 相关事件。这适用于所有的`touch`(iOS, Android)和`pointer`事件(Windows Phone)。
gesture		在触摸设备上触发 pinch 手势事件。
stack		提供 andSelf& end()链式调用方法
ios3		String.prototype.trim 和 Array.prototype.reduce 方法 (如果他们不存在) ，以兼容 iOS 3.x.

可以看到Zepto默认构建只包含以下模块：Core, Ajax, Event, Form, IE。即当我们引入zepto.js文件时，只能调用这五个模块支持的用法。如果需要构建其他模块，就需要新引入所需模块的js文件，或是自定义构建，即将所需模块打包入zepto.js文件，也就是zepto定制。

zepto定制步骤

1. 安装Node.js环境：

http://nodejs.cn/download/ 下载node.js；

2. 下载zepto.js

https://github.com/madrobby/zepto 下载zepto.js，解压；

3. 在start menu（开始菜单）点击node.js command prompt，进入第2步解压后的目录，如在命令行输入：

4. 在当前目录的命令行执行npm install命令

5. 编辑zepto-master文件夹内的make文件，添加自定义模块：在target.build部分的modules行添加新增模块即可。如：

modules = (env['MODULES'] || 'zepto event ajax form ie fx selector').split(' ')

6. 然后执行命令 npm run-script dist

7. 查看目录dist即构建好的zepto.js