【requireJS源码学习02】data-main加载的实现
摘要:前言经过昨天的学习,我们大概了解到了requireJS的主要结构,这里先大概的回顾一下首先从总体结构来说,require这里分为三块:① newContext之前变量声明或者一些工具函数② newContext大家伙③ 解析script标签抽出data-main,并提供几个对外接口从流程上讲,大概发生了这些事情:① script标签引入requireJS后,便会初始化一些变量以及函数,并不干实际的事情② 在主干结构第三步之前会使用req({})调用(并且只会调用一次)newContext方法由此会维护一个newContext的闭包环境,之后的很多变量全在其中③ 取出script标签中的data
阅读全文
posted @
2014-03-30 16:00
叶小钗
阅读(21562)
推荐(4)
【requireJS源码学习01】了解整个requireJS的结构
摘要:前言现在工作中基本离不开requireJS这种模块管理工具了,之前一直在用,但是对其原理不甚熟悉,整两天我们来试着学习其源码,而后在探寻其背后的AMD思想吧于是今天的目标是熟悉requireJS整体框架结构,顺便看看之前的简单demoRequireJS学习笔记程序入口源码阅读仍然有一定门槛,通看的做法不适合我等素质的选手,所以还是得由入口开始,requireJS的入口便是引入时候指定的data-main在js引入后,会自动执行指向data-main的js函数,这个就是我们所谓的入口,跟着这条线,我们就进入了requirejs的大门首先,引入js文件本身不会干什么事情,那么requirejs内部
阅读全文
posted @
2014-03-29 18:25
叶小钗
阅读(21889)
推荐(15)
【grunt整合版】30分钟学会使用grunt打包前端代码
摘要:grunt是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:① 压缩文件② 合并文件③ 简单语法检查对于其他用法,我还不太清楚,我们这里简单介绍下grunt的压缩、合并文件,初学,有误请包涵准备阶段1、nodeJs环境因为grunt是基于nodeJs的,所以首先各位需要安装nodeJ...
阅读全文
posted @
2014-03-17 09:41
叶小钗
阅读(129902)
推荐(198)
【grunt第三弹】grunt在前端实际项目中的应用
摘要:前言【grunt第二弹】30分钟学会使用grunt打包前端代码(02)【grunt第一弹】30分钟学会使用grunt打包前端代码经过前两次的学习,我们了解了grunt打包的一些基础知识,对于压缩几个文件有了初步认识但是实际项目中的应用往往不是那么简单的,因为我们会有分支,我们也会有app版本Html5版本,更复杂的情况是我们有各个频道,而且各个频道是不同的团队在开发那么统一的一套打包工具如何满足不同团队的需求呢?然后,我们本地联调时候,仍然需要打包,但是打包的代码有些时候却不想要minify,这些功能都是实际项目重要用到的我们这个时间化大力气学习grunt打包一块的知识是有绝对意义的,不然前端
阅读全文
posted @
2014-03-16 15:17
叶小钗
阅读(7256)
推荐(6)
【小贴士】关于transitionEnd/animate的一个有趣故事
摘要:前言在很久之前,我们项目有一个动画功能,功能本身很简单,便是典型的右进左出,并且带动画功能以当时来说,虽然很简单,但是受限于框架本身的难度,就直接使用了CSS3的方式完成了功能当时主要使用transform与animation实现功能,并且用了一个settimeout执行回调,然后此事便不了了之了但是出来混总是要还的,这不,最近相似的东西又提了出来,我们当然可以将原来的那套东西拿来用,但是看着那个settimeout总是不是滋味,因为这样捕捉回调的效果以及可能引起的BUG大家都懂,于是就想使用transitionEnd监控动画结束再执行相关回调,于是便有了一个有趣的想法当时的心声嗯,不行,这次
阅读全文
posted @
2014-03-15 22:40
叶小钗
阅读(9550)
推荐(9)
【grunt第二弹】30分钟学会使用grunt打包前端代码(02)
摘要:前言上一篇博客,我们简单的介绍了grunt的使用,一些基础点没能覆盖,我们今天有必要看看一些基础知识【grunt第一弹】30分钟学会使用grunt打包前端代码配置任务/grunt.initConfig前面我们简单的介绍了grunt相关的知识,这里我们这里还需要再熟悉下Gruntfile相关的知识点,比如说配置任务grunt的任务配置都是在Gruntfile中的grunt.initConfig方法中指定的,这个配置主要都是一些命名性属性比如我们上次用到的合并以及压缩的任务配置:grunt.initConfig({ concat: { //这里是concat任务的配置信息 ...
阅读全文
posted @
2014-03-15 16:36
叶小钗
阅读(10073)
推荐(20)
【grunt第一弹】30分钟学会使用grunt打包前端代码
摘要:前言以现在前端js激增的态势,一个项目下来几十个js文件轻轻松松对于复杂一点的单页应用来说,文件上百简直是家常便饭,那么这个时候我们的js文件应该怎么处理呢?另外,对于css文件,又该如何处理呢??这些都是我们实际工作中要遇到的问题,比如我们现在框架使用zepto、backbone、underscore我们要如何将他们合成一个libs文件,这都是令人头疼的问题但是grunt的出现却让这些事情变得优雅起来!简单一键,打包结束,尼玛不是不可能啊!grunt是一套前端自动化工具,一个基于nodeJs的命令行工具,一般用于:① 压缩文件② 合并文件③ 简单语法检查对于其他用法,我还不太清楚,我们这里简
阅读全文
posted @
2014-03-12 00:48
叶小钗
阅读(37481)
推荐(50)
【单页应用】我们该如何处理框架弹出层层级关系?
摘要:前言最近总结不多,一方面是之前的知识点多比较基础,所以学习总结起来比较快但是基础知识只有那么一点,现在当然可以从新知识点着手拓宽视野(这个当然要继续),但是基础积累,再深入学习是成为优秀前端必不可少的阶段所以这块地方还得死扛,所幸现在是个优秀的团队,身边高手前辈较多,有时候请教是很有方向的,这个很是幸运啊!其次年后来到公司后,总有点浮浮沉沉的事情发生,而每年的3月又是各个公司“变化”的集中期,所以心境受到了一些影响,此点不可不慎啊!搞技术的不可浮躁!如果心思过多的花在了“人事”上,那么就真有点背道而驰了,技术人员的核心竞争还是应当在技术上当然,年后会为年前干的一些事情擦屁股,一般每个团队年前都
阅读全文
posted @
2014-03-09 15:57
叶小钗
阅读(12480)
推荐(8)