1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Maven.Node催生了一批自动化工具,像Bower,Yeoman,Grunt等.而如今前端提到构建工具会自然想起Grunt.Java世界里的Maven提供了强大的包依赖管理和构建生命周期管理. 在JavaScript的世界里,Grunt.js是基于Node.js的自动化任务运行器.2013年02月18日,Grunt v0.4.0 发布.F

Maven面临的挑战 软件行业新旧交替的速度之快往往令人咂舌,不用多少时间,你就会发现曾经大红大紫的技术已经成为了昨日黄花,当然,Maven也不会例外.虽然目前它基本上是Java构建的事实标准,但我们也能看到新兴的工具在涌现,比如基于Goovy的Gradle,而去年Hibernate宣布从Maven迁移至Gradle这一事件更是吸引了不少眼球.在此之前,我也听到了不少对Maven的抱怨,包括XML的繁冗,不够灵活,学习曲线陡峭等等.那Gradle是否能够在继承 Maven优点的基础上,克服这些缺

1. Grunt -> Gulp 早些年提到构建工具,难免会让人联想到历史比较悠久的Make,Ant,以及后来为了更方便的构建结构类似的Java项目而出现的Maven.Node催生了一批自动化工具,像Bower,Yeoman,Grunt等.而如今前端提到构建工具会自然想起Grunt.Java世界里的Maven提供了强大的包依赖管理和构建生命周期管理. 在JavaScript的世界里,Grunt.js是基于Node.js的自动化任务运行器.2013年02月18日,Grunt v0.4.0 发布.F

Gulp和Webpack的基本区别: gulp可以进行js,html,css,img的压缩打包,是自动化构建工具,可以将多个js文件或是css压缩成一个文件,并且可以压缩为一行,以此来减少文件体积,加快请求速度和减少请求次数:并且gulp有task定义处理事务,从而构建整体流程,它是基于流的自动化构建工具. Webpack是前端构建工具,实现了模块化开发和文件处理.他的思想就是“万物皆为模块”,它能够将各个模块进行按需加载,不会导致加载了无用或冗余的代码.所以他还有个名字叫前端模块化打包工具.

原文地址:gulp初学 至于gulp与grunt的区别,用过的人都略知一二,总的来说就是2点: 1.gulp的gulpfile.js  配置简单而且更容易阅读和维护.之所以如此,是因为它们的工作方式不同,gulp的流式构建使得gulpfile.js文件写起来并不是像Gruntfile.js一样完成一个个插件的配置那样多.对于这点我的理解还不是很深刻,只能暂时这样做一个比较吧,以后的学习接触多了应该就会深刻的体会到. 2.似乎gulp的上手比grunt更简单一些,或者说一个是轻量级一个是重量级的吧

https://github.com/fex-team/fis FIS入门: http://fis.baidu.com/docs/beginning/getting-started.html FIS 与 Grunt 的区别  http://fex.baidu.com/blog/2014/03/fis-and-grunt/

001.什么是webpack? 作用有哪些? WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其转换和打包为合适的格式供浏览器使用 Webpack的工作方式是:把你的项目当做一个整体,通过一个给定的主文件(如:index.js),Webpack将从这个文件开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包为一个(或多个)浏览器可识别的JavaScr

在软件开发中使用自动化构建工具的好处是显而易见的.通过工具自动化运行大量单调乏味.重复性的任务,比如图像压缩.文件合并.代码压缩.单元测试等等,可以为开发者节约大量的时间,使我们能够专注于真正重要的.有意义的工作,比如设计业务逻辑,编写代码等等. 对很多前端开发人员而言,Grunt 无疑是这方面的首选.基本上,如果你会用 JavaScript ,那么在一个名为 Gruntfile.js (或者 Gruntfile)的文件中用 Javascript 语言定义自动化任务是非常简单的过程,同时大量的

001.什么是webpack? 作用有哪些? WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其转换和打包为合适的格式供浏览器使用 Webpack的工作方式是:把你的项目当做一个整体,通过一个给定的主文件(如:index.js),Webpack将从这个文件开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包为一个(或多个)浏览器可识别的JavaScr

你所不知道的 CSS 阴影技巧与细节   关于 CSS 阴影,之前已经有写过一篇,box-shadow 与 filter:drop-shadow 详解及奇技淫巧,介绍了一些关于 box-shadow 的用法. 最近一个新的项目,CSS-Inspiration,挖掘了其他很多有关 CSS 阴影的点子,是之前的文章没有覆盖到的新内容,而且有一些很有意思,遂打算再起一篇. 本文的题目是 CSS 阴影技巧与细节.CSS 阴影,却不一定是 box-shadow 与 filter:drop-shadow,为

写在前面: 在git上面clone一些项目的时候老是可以看到一些测试文件,于是就学习了一下TDD: TDD —— Test-Drive Development是测试驱动开发的意思,是敏捷开发中的一项核心实践和技术,也是一种测试方法论.TDD的原理是在开发功能代码之前,先编写单元测试用例代码,测试代码确定需要编写什么产品代码 —— 引自百度百科,(当所有的测试用例通过了,就说明你的组件完成了). 实现的过程 —— 当修改组件代码的时候,自动触发,执行测试用例,实时反映结果.笔者为了“自动”两个字,

1.使用gulp的步骤 1.安装node检测是否安装好 cmd->node -v2.安装gulp 可以在npm或者在cnpm3.在node里面有个文件package.json.利用命令行npm init4.本地安装插件,在这个文件夹中,直接在npm下载下来5.在文件夹中新建一个gulpfile.js(名字必须是这个),其他的代码都是写在这个xxx.js的文件中的 2.基本语法gulp.task("defult",function(){        return gulp.src

想要使用gulp,就要了解gulp,就像追自己的爱豆,你要知道爱豆的喜好.兴趣 简单的了解你的新爱豆———安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务 1. gulp的用途: 代码压缩 CSS自动加前缀 LESS编译 地址版本追加 文件合并 文件修改自动刷新页面 更新编译本地依赖静态资源自动加缓存戳避免客户端浏览器缓存 看到这些作用,似乎gulp与grunt没什么区别 然鹅,对于这两款作用相同的前

1. 什么是webpack 一个现代 JavaScript 应用程序的静态模块打包器(module bundler),它会分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其转换和打包为合适的格式供浏览器使用. 2. webpack的作用 模块化,让我们可以把复杂的程序细化为小的文件: 类似于TypeScript这种在JavaScript基础上拓展的开发语言,使我们能够实现目前版本的JavaScript不能直接使用的

一.初识webpack 1.什么是webpack? WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其转换和打包为合适的格式供浏览器使用 2.webpack工作的方式 把你的项目当做一个整体,通过一个给定的主文件(如:index.js),Webpack将从这个文件开始找到你的项目的所有依赖文件,使用loaders处理它们,最后打包为一个(或多个)浏览器可识别的Jav

Gulp应该和Grunt比较,他们的区别我就不说了,说说用处吧.Gulp / Grunt 是一种工具,能够优化前端工作流程.比如自动刷新页面.combo.压缩css.js.编译less等等.简单来说,就是使用Gulp/Grunt,然后配置你需要的插件,就可以把以前需要手工做的事情让它帮你做了.说到 browserify / webpack ,那还要说到 seajs / requirejs .这四个都是JS模块化的方案.其中seajs / require 是一种类型,browserify / we

Android 开发也挺长时间了,从开始就使用的AndroidStudio开发,但是说下来其实自己对AS(AndroidStudio简称)还真的是不了解不深入.好吧,其实我只知道AS是一个相当强大的工具,我要学习的还有很多.  言归正传,这段时间在学习RtroLambda和ButterKnife的使用,我发现他们的导入在Project的build.gradle中引入的而不是在app的build.gradle中,这让我觉得有点郁闷,因为我才发现不太知道这两个gradle的区别,下面来总结一下. 一

首先用一段通俗易懂但是不是非常专业的话描述一下三者的概念.区别和联系. Gradle是个构建系统,能够简化你的编译.打包.测试过程.熟悉Java的同学,可以把Gradle类比成Maven. Gradle Wrapper的作用是简化Gradle本身的安装.部署.不同版本的项目可能需要不同版本的Gradle,手工部署的话比较麻烦,而且可能产生冲突,所以需要Gradle Wrapper帮你搞定这些事情.Gradle Wrapper是Gradle项目的一部分. Android Plugin for Gr

转自:http://www.infoq.com/cn/news/2011/04/xxb-maven-6-gradle Maven面临的挑战 软件行业新旧交替的速度之快往往令人咂舌,不用多少时间,你就会发现曾经大红大紫的技术已经成为了昨日黄花,当然,Maven也不会例外.虽然目前它基本上是Java构建的事实标准,但我们也能看到新兴的工具在涌现,比如基于Goovy的Gradle,而去年Hibernate宣布从Maven迁移至Gradle这一事件更是吸引了不少眼球.在此之前,我也听到了不少对Maven

一般创建一个android项目后回出现两个gradle: build.gradle(Project):用来配置整个工程的 build.gradle(app):一个是用来配置app的 对compile和classpath区别的解释: I’m going to guess that you’re referencing compile and classpath within the dependencies {} block. If that is so, those are dependency

1. 书写方式 grunt 运用配置的思想来写打包脚本,一切皆配置,所以会出现比较多的配置项,诸如option,src,dest等等.而且不同的插件可能会有自己扩展字段,导致认知成本的提高,运用的时候要搞懂各种插件的配置规则.gulp 是用代码方式来写打包脚本,并且代码采用流式的写法,只抽象出了gulp.src, gulp.pipe, gulp.dest, gulp.watch gulp.task等接口,运用相当简单.经尝试,使用gulp的代码量能比grunt少一半左右. 2. 任务划分 gul