seajs 使用心得二【原创】

seajs使用心得二【原创】 web前端 杭州-小白

之前我也有写一篇文章介绍了seajs的简单入门使用, http://www.xiaobai8.com/Blog/700.html,不过这个已经是针对seajs前期的版本了.

现在seajs都升级到了2.2了,构建方式也是用了grunt 构建.

摘要:

1.Windows下使用grunt构建.

2.关于使用jquery.

3.关于使用jquery插件.

一:Windows下使用grunt构建
1.安装nodejs  
2.安装grunt-cli (参考:http://gruntjs.com/)

3.通过命令提示行进入目录(我这里是进入的scripts目录):
这个目录要准备:package.json 和 Gruntfile.js 这两个文件.
(关于如何配置:参考来源:https://github.com/seajs/seajs/issues/672 和
http://hi.baidu.com/liuda101/item/54bcf8d0b6a65602d68ed057 和 
http://gruntjs.com/configuring-tasks#files )

4.安装grunt,目前最新的是直接在此目录使用如下命令:

会自动检索package.json包里面的版本.并自动安装.

5.Gruntfile.js如果前面已经配置好.构建命令:

6.构建完成 index.html 使用如下:

未构建前使用

seajs.use(“application/testApp/application”);

构建后使用

seajs.use(“appjs/testApp/application”);

二: 关于使用jquery

jquery1.7+本身支持amd的但是不支持cmd,你就需要在源码的最后把amd改成CMD的就Ok了,

详情请看CMD模块定义规范 https://github.com/seajs/seajs/issues/242

比如我seajs引入的是 demo/app/seajs/sea.js 那么seajs的基本路径是 demo/app/

那么此时我们的jquery的目录存放地址是demo/app/jquery/1.10/jquery.js , 那么它的标识应该就要改成 jquery/1.10/jquery.

eg:

之前:

之后:

三: 关于使用jquery插件

包装 jquery-tabs.js 插件:

使用插件:

这个时候后面就可以使用插件了 .jquery插件的名字最好不要有像这样jquery.min.js这样,grunt build的时候处理插件依赖的时候,名字最后貌似错掉了变成了jquery.js.所以我建议是jquery-min.js这个样子的名字就不会错了.

由于篇幅原因 可以查看此项目的源码地址 https://github.com/lovexiaobai/HelloSeajs/

备注:此项目源码里面有jquery插件的包装方式和jquery本身的包装方式可供参考.

以上仅仅是目前项目的代码可以正常运行起来,但是有些东西和使用变化更新很快,需要大家自己去把握和斟酌咯,我这里只是简单的记录一下.

小白 2013-09-05

本文固定链接: http://www.xiaobai8.com/Blog/835.html | web前端,杭州小白的个人博客,小白的个人博客

该日志由 杭州-小白 于2013年09月05日发表在 other, 分享 分类下,
原创文章转载请注明: seajs 使用心得二【原创】 | web前端,杭州小白的个人博客,小白的个人博客
关键字: , , ,

报歉!评论已关闭.