前言 现在前端自动化已经是家常便饭,各种工具也是层出不穷,grunt、gulp、webpack是应用最广的三种工具,虽然grunt看似已垂垂老矣,但是以前写的很多项目一直用的就是grunt,温故方能知新,这里把grunt的基本操作再记录一下。 grunt常用插件 开始使用grunt很简单 ...
在不久前我曾写了一篇 应用r.js来优化你的前端的文章,为大家介绍了r.js这个实用工具,它可以很好地压缩 合并前端文件并打包整个项目。但是如果将r.js放到项目中,我们不得不顾及到一个问题 项目每维护一次,就需要维护的人员输入一次rjs运行口令重新打包项目,自然是非常繁琐的事情。另外如果我们的项目用sass来写样式,可能还得外开一个koala。如果我们能让项目自己处理自己的所有事宜,那一切就美好 ...
2014-09-21 00:32 3 3492 推荐指数:
前言 现在前端自动化已经是家常便饭,各种工具也是层出不穷,grunt、gulp、webpack是应用最广的三种工具,虽然grunt看似已垂垂老矣,但是以前写的很多项目一直用的就是grunt,温故方能知新,这里把grunt的基本操作再记录一下。 grunt常用插件 开始使用grunt很简单 ...
前端优化是尽量减少http请求,所以我们需要尽量合并压缩文件,然后调用压缩后的文件,比如多个css文件压缩成一个,多个js文件合并压缩等,usemin能够自动在html中使用压缩后的文件,达到上面的目的。 上图是完整打包后的文件目录,原始目录是assets,打包发布的文件是dist. ...
引言 在之前根据项目具体情况,开发了一套自动预报数据的平台,也写了博客:Django自动化测试平台项目案例。但是前端页面不耐看,久了就生厌。于是就想更换前端框架,顺便记录一下。 前端设计 原来的界面: 一键预报模块 ...
前端工作流程自动化——Grunt/Gulp 自动化 Grunt/Gulp 都是node.js下的模块,简单来说是自动化任务运行器,两者都有社区及大量的插件支撑,在所有的自动化工具领域里,这两者是最好的前端自动化构建工具。 那么问题来了,Grunt和Gulp到底哪家强 ...
上篇文章介绍了前端模块化开发工具seaJs,利用seaJs我们可以轻松实现前端的模块化编程,参见http://www.cnblogs.com/luozhihao/p/4818782.html 那么今天我继续介绍前端开发的另一工具——grunt。关于介绍grunt文章网上已经存在很多,而本文主要 ...
jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学、不用! 1. 前言 各位web前端开发人员,如果你现在还不知道grunt或者听说过、但是不会熟练使用grunt,那你就真的真的真的out了(三个“真的”重复 ...
前言 【grunt第二弹】30分钟学会使用grunt打包前端代码(02) 【grunt第一弹】30分钟学会使用grunt打包前端代码 经过前两次的学习,我们了解了grunt打包的一些基础知识,对于压缩几个文件有了初步认识 但是实际项目中的应用往往不是那么简单的,因为我们会有分支 ...
用grunt搭建自动化的web前端开发环境实战教程(详细步骤) jQuery在使用grunt,bootstrap在使用grunt,百度UEditor在使用grunt,你没有理由不学、不用!前端自动化,这样的一个名词听起来非常的有吸引力,向往力。当今时代,前端工程师需要维护的代码变得及为庞大和复杂 ...