如何定制你自己的jQuery

jQuery随着版本的不断升级代码量也随之增加,从1.0.0的不到两千行到现在的1.10.2已经突破1万行。

新的API不断增加,但有些在项目中并没有用到。jQuery团队很早就考虑到这一点,按模块来划分,并可以按需定制自己的jQuery。

jQuery从1.9开始构建工具迁移到grunt。grunt是基于node的,因此需要安装node,下面详细介绍。

一、安装node

很简单,这里有入门参考

二、安装grunt

也很简单,这里有入门参考

三、去github下载jQuery源码

使用命令: git clone git://github.com/jquery/jquery.git

下载后的目录

四、安装依赖包

确保第二步里grunt-cli已经安装(推荐全局安装,使用参数-g)。

这里使用命令npm install即可,下载的东西比较多,大概需要1分钟左右。此时根目录jquery中多了一个node_modules,如下

可以看到安装了一堆lib,uglify、gzip.js、requirejs等。至此,所有安装都已完毕。

五、编译源码到dest目录

非常简单,cd到jquery目录,敲grunt,如图

此时jquery目录里多了一个dest目录

dest目录有三个文件,未压缩的jquery.js,压缩的jquery.min.js和souremap(jquery.min.map需浏览器支持),这就是最终生产环境用到jquery版本。和你在官网下载的没有任何区别。

注意:

默认编译的是的2.x版本,2.x不支持IE6,7,8,如果想编译1.x的版本,使用git命令 git checkout 命令,如下将切换的 1.10.0

git checkout 1.10.0

所有的tag可通过命令 git tag 查看

六、定制你自己的jQuery

上面编译的是完整版的jQuery,如果想定制自己的jQuery,比如你不需要动画模块,或者不需要ajax模块等。

查看jquery目录下的src目录,可以看到jQuery自身是分模块开发的,各个模块在独立的目录或文件里,如下图

除了 核心模块(core)和 选择器(selector),其它模块都可以定制(包含或排除)。

比如你的项目中没有用到ajax模块,那么通过以下命令编译的jquery.js将不包含$.ajax, $.get, $.getJSON等。

cd到jquery目录,输入 grunt custom:-ajax

此时查看dest目录下的jquery.js会发现代码只有7千多行,少了许多。这个版本的jquery版本号也很特殊,如下

不想包含多个模块,以逗号分隔即可,如

不包含ajax和动画:grunt custom:-ajax,-effects

不包含css、位置、包裹:grunt custom:-css,-offset,-wrap

七、修改jQuery的AMD模块名

我们知道jQuery可以做为AMD的一个模块存在,它默认的模块名是 "jquery"。

如果不想使用该名称,通过命令 grunt custom --amd="my-jquery" 即可完成修改

这时jquery的模块名称就变为 "my-jquery" 了,jquery.js源码中体现如下

1
2
3
4
5
if ( typeof define === "function" && define.amd ) {
    define( "my-jquery", [], function() {
        return jQuery;
    });
}

此时当你的模块require时,需要改为 require('my-jquery'),通过define传递依赖时也需要改下。

特殊情况下你可能要使用一个匿名模块,使用命令 grunt custom --amd="",关于AMD及模块化请猛击 Modular JS

如果您觉得这文章对您有帮助或鼓励我继续写博,可以打赏点钱给我 我的支付宝.

 
 
分类: jQuery

定制你自己的jQuery的更多相关文章

  1. 如何定制你自己的jQuery

    jQuery随着版本的不断升级代码量也随之增加,从1.0.0的不到两千行到现在的1.10.2已经突破1万行. 新的API不断增加,但有些在项目中并没有用到.jQuery团队很早就考虑到这一点,按模块来 ...

  2. TaggingJS – 可以灵活定制的 jQuery 标签系统插件

    TaggingJS 是一款 jQuery 插件,用来创建高度可定制的前端标签系统.这款插件不到3KB ,支持主流浏览器.有几种方法来定制 TaggingJS 的默认行为:一是使用  custom_op ...

  3. jQuery Mobile入门

    转:http://www.cnblogs.com/linjiqin/archive/2011/07/17/2108896.html 简介:jQuery Mobile框架可以轻松的帮助我们实现非常好看的 ...

  4. jquery.mobile手机网页简要

    先上最终效果: 最近做了一个用手机浏览器访问的web应用,采用较流行的HTML5,为了提高开发效率节省时间决定采用现有开源框架,免去了自己做设计与兼容性. 一些比较优秀的框架:10大优秀的移动Web应 ...

  5. S Gallery – 很有特色的响应式 jQuery 相册插件

    S Gallery 是一款响应式的 jQuery 相册插件.使用了 HTML5 全屏 API 以及 CSS3 动画 和 CSS3 转换,所以只能在支持这些功能的浏览器中使用. 这款插件它有一个特色功能 ...

  6. 赞!带进度条的 jQuery 文件拖放上传插件

    jQuery File Uploader 是一个 jQuery 文件拖放上传插件,包括 Ajax 上传和进度条效果.作者编写这个插件的想法是要保持它非常简单,不像其他的插件,很多的标记,并提供一些 H ...

  7. Slick – 这是你需要的最后一款 jQuery 传送带插件

    slick 是一款完全响应式的 jQuery 传送带插件,能够根据容器自动适应宽度.在现代浏览器中会使用 CSS3 来实现特殊效果,可以使用扩展方法对项目进行添加.删除和过滤.这是你需要的最后一款 j ...

  8. Pop Easy – 轻松实现模态窗口的 jQuery 插件

    PopEasy 是一款轻量的 jQuery 插件,可以帮助开发人员容易的创建效果精美的模态窗口.PopEasy 在主流浏览器中都能够正常工作,同时兼容 IE 7 哦. 您可能感兴趣的相关文章 Metr ...

  9. jQuery.swatches – 把 Div 变成可爱的调色板

    jQuery.swatches 是一款开源的 jQuery 插件,能够把一个 Div 转换成漂亮的调色板.您可以自定义你想要的类,使用不同的类可以生成不同的调色板.这个功能能够帮助设计师方便的挑选设计 ...

随机推荐

  1. 内存四个领域,变量声明和定义,注册,c内联汇编,auto,堆,不变,静态变量

     1.内存四大区域 2.在程序中,变量的声明能够有多份,定义仅仅能有一份 watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdG90b3R1enVvcXVh ...

  2. thinkphp学习笔记8—命名空间

    原文:thinkphp学习笔记8-命名空间 新版本(3.2)中采用命名空间的方式定义和加载类库文件,解决多个模块之间的冲突问题,并实现了更加高效的自动加载机制. 需要给类库定义所在的命名空间,命名空间 ...

  3. 详细解释 集成Maven Spring Mybatis项目包生成Bat文件

    有时在项目必须Maven项目包生成bat文件,长官一人.本文将解释的具体使用方法maven-assembly-plugin插件实现bat文件包. 1.首先看一下项目结构 2.配置pom.xml文件,在 ...

  4. Android dumpsys命令的使用

    Android提供的dumpsys工具能够用于查看手机中的应用程序和系统服务信息与状态,手机连接电脑后能够直接命令行运行adb shell dumpsys 查看全部支持的Service可是这样输出的太 ...

  5. rdlc报告vs2008编辑正常,在vs2012在对错误的编辑

    最近我们的系统开发的工具vs2008升级到2012,由于系统是非常的报告是由rdlc发展.今天 有需要修改的报告满足需求.直接使用vs2012正确rdlc报告编辑,结果本次变动后.报表都报错. 后来我 ...

  6. jquery扩展

    jQuery插件的开发包括两种: 一种是类级别的插件开发,即给jQuery添加新的全局函数,相当于给jQuery类本身添加方法.jQuery的全局函数就是属于jQuery命名空间的函数,另一种是对象级 ...

  7. ROOT android 原理。 基于(zergRush)

    出自: http://bbs.gfan.com/android-2996211-1-1.html 须要ROOT的同学请去上面的地址下载. a.控制手机创建个暂时目录,然后把zergRush脚本写入此目 ...

  8. MVC 插件化框架支持原生MVC的Area和路由特性

    .NET MVC 插件化框架支持原生MVC的Area和路由特性 前面开放的源码只是简单的Plugin的实现,支持了插件的热插拔,最近晚上偶然想到,原生的MVC提供Areas和RouteAtrribut ...

  9. SP服务商收益究竟有多大?

    揭秘spspsp服务商怎样盈利?代办sp服务商又称持增值电信----移动网信息服务许可证信息提供商,sp主要业务有短信彩信(手机报.短信群发.客服系统).WAP.彩铃.IVR.百宝箱.JAVA游戏.B ...

  10. UVa 10533 - Digit Primes

    题目:输出给定区间中,本身是素数,而且这个数的各位之和也是素数的数(称为位素数)的个数. 分析:数论.首先利用筛法,求出1000000内的全部的素数:然后在利用生成的素数表, 推断每一个数是不是各位之 ...