gulp常用插件的使用 今天来看看一下gulp的常用插件的使用 就像gruntjs需要一个Gruntfile.js文件一样,gulp也需要一个文件作为它的主文件,在gulp中这个文件叫做gulpfile.js. 在项目根目录下新建文件gulpfile.js文件 目录结构 ├── gulpfile.js ├── node_modules │ └── gulp └── package.json gulp API介绍 详情查看官方文档 . gulp.task() 用来定义任务 . gulp.src()

1.前言 前端缓存一直是个令人头疼的问题,你有可能见过下面博客园首页的资源文件链接: 有没有发现文件名后面有一串不规则的东东,没错,这就是运用缓存机制,我们今天研究的就是这种东西. 先堵为快,猛戳链接下载Demo :http://pan.baidu.com/s/1jI4n1hs 以dist为根目录,运行http://localhost/html/index.html,如果出现"Good!成功加载index.js",则表示成功了. 不熟悉gulp的同学,可以参考这个比较详细的教程:htt

gulp 使用介绍 gulp gulp 插件 gulp的配置文件gulpfile.js gulp 语法 gulp 实例 gulp的缺点 gulp gulp是基于Node.js的前端自动化构建工具,主要用于代码打包.目前主流的前端打包工具,grunt,gulp,webpack.grunt现在似乎慢慢被gulp取代,而我使用gulp也是冲着大家说的配置简单去的,至于通道流,运行文件什么的其实还是次要的:webpack现在很火,听说功能强大,没有用过. npm install gulp -g 注意需要

Grunt和Gulp构建工具在Visual Studio 2015中的高效的应用 Grunt和Gulp是Javascript世界里的用来做自动压缩.Typescript编译.代码质量lint工具.css预处理器的构建工具,它帮助开发者处理客户端开发中的一些烦操重复性的工作.Grunt和Gulp都在Visual studio 2015中得到支持.ASP.NET 项目模板默认使用Gulp. Grunt和Gulp Grunt和Gulp有什么区别?Gulp虽然是稍微晚一点登场的,但是它因crisp pe

var gulp=require('gulp'), babel = require('gulp-babel'), gulpSequence = require('gulp-sequence'), htmlmin = require('gulp-htmlmin'), sftp= require('gulp-sftp'), concat=require('gulp-concat'),//文件合并 uglify=require('gulp-uglify'),//js压缩 minifyCss=requi

Grunt和Gulp是Javascript世界里的用来做自动压缩.Typescript编译.代码质量lint工具.css预处理器的构建工具,它帮助开发者处理客户端开发中的一些烦操重复性的工作.Grunt和Gulp都在Visual studio 2015中得到支持.ASP.NET 项目模板默认使用Gulp. Grunt和Gulp Grunt和Gulp有什么区别?Gulp虽然是稍微晚一点登场的,但是它因crisp performance和优雅的语法受到欢迎.与Grunt不同,Grunt往往在硬盘上是

1.项目结构和生产之后的目录 2.gulpfile.js // 载入插件 var gulp = require('gulp'), //本地安装gulp所用到的地 sass = require('gulp-sass'), // 处理sass less = require('gulp-less'), // 处理less autoprefixer = require('gulp-autoprefixer'), //根据设置浏览器版本自动处理浏览器前缀 minifycss = require('gulp

前公司代码一直用grunt部署, 偶然了解gulp后:学习gulp并用gulp和grunt在一小项目中实践,对两者之间的用法及区别有所了解后总结这一篇小博文:本文根据实战的项目配置文件,简单讲解实现相同功能时gulp与grunt的用法比较: 大家都知道gulp grunt是部署代码的工具(合并.压缩.加密.编译等),故本文不讲解gulp.grunt的历史.使用场景,有兴趣的同学可以细看本文后的参考文档: 一.项目部署任务说明 本文对应的项目:三国杀FAQ(已下线), 本项目为静态页面,开始只作为

本人前端用惯了Hbuilder,修改了eclipse项目中的文件后,由于是外部编辑器修改过的,eclipse不会自动部署更新,一般按F5刷新项目,或者在 preferences > general > workspace 设置更新,但这个方法也需要等7.8秒才能被部署更新.本节介绍用gulp解决这个问题. 先睹为快,猛戳链接下载Demo :http://pan.baidu.com/s/1o8pmrH4 由于是在gulp环境下才能运行,不熟悉gulp的同学,可以参考这个比较详细的教程:http:

这篇文章不会介绍 gulp 的起源.发展:不会去一个个讲解 gulp API:也不想出现大段大段的 gulpfile.js 代码:更木有帮你分析 gulp 实现原理,只有一些我自己对 gulp 的使用理解和总结. 如何通过 gulp 让偶们的前端项目高大上的跑起来?gulp 能做什么,还能做什么?gulp套路能不能来几套?... 希望通过这篇文章你会找到答案 写作风格的原因,劳资写的文章都较详(啰)细(嗦),请轻拍:) 当然,同样期待能得到伙伴们的讨论和支持. 目录 简单介绍 必备插件 常用插件

安装gulp 因为gulp是基于node的管理工具,所以要先安装nodejs安装nodejsnodejs下载地址:中文站:http://nodejs.cn/ 英文站:https://nodejs.org/en/下载后直接运行.msi文件安装完成后,打开命令行(win+R)键入node -查看node版本 全局安装gulp npm install -g gulp 在项目目录下安装gulp,若要在安装的时候把gulp写进项目package.json文件的依赖中,则可以加上–save-dev:(项目目

简介 Gulp是一个基于流的自动化构建器. 安装 npm config set registry http://registry.npm.taobao.org ---最好用国内源 npm install -g gulp npm install --save-dev gulp 创建文件 gulpfile.js var gulp = require('gulp'); gulp.task('default', function() { // place code for your default ta

gulp进阶构建项目由浅入深 阅读目录 gulp基本安装和使用 gulp API介绍 Gulp.src(globs[,options]) gulp.dest(path[,options]) gulp.task(name[,deps],fn); gulp.watch(glob[,opts],tasks) gulp一些常用插件 gulp-rename(重命名) gulp-uglify(JS压缩) gulp-minify-css(css文件压缩) gulp-minify-html(html压缩) gu

grunt vs gulp 虽然gulp已经出来很久了,但是一直没有去使用过.得益于最近项目需要,就尝试了一下,以下从几个要点讲一下grunt和gulp使用的区别,侧重讲一下在使用gulp过程中发现的问题.而两种工具孰优孰劣由读者自己判断. 1. 书写方式 grunt 运用配置的思想来写打包脚本,一切皆配置,所以会出现比较多的配置项,诸如option,src,dest等等.而且不同的插件可能会有自己扩展字段,导致认知成本的提高,运用的时候要搞懂各种插件的配置规则.gulp 是用代码方式来写打包脚

最近一直在构建Angular应用,通过bower管理前端包依赖,然后通过gulp和它配合.发现gulp相比于grunt真的很轻,现在我的项目中已经取代了grunt.这里把我的一些实践贴记录下来和大家分享一下. gulp定位和grunt一样也是前端构建工具,和grunt相比它更突出一个流的概念,它所有的任务执行都是one by one的感觉,官网的自定义就是: gulp's use of streams and code-over-configuration makes for a simpler

摘要: Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 搭建web服务器 文件保存时自动重载浏览器 使用预处理器如Sass.LESS 优化资源,比如压缩CSS.JavaScript.压缩图片 当然Gulp能做的远不止这些.如果你够疯狂,你甚至可以使用它搭建一个静态页面生成器.Gulp真的足够强大,但你必须学会驾驭它. 这是这篇文章的主要目的.帮助你了解Gulp的基础用法,助你早日完成一统天下的大业. 在我们深入了解之前,我们先来说说为什么是Gulp. 为什么是Gulp? 类似G

原 荐 gulp构建前端工程 半张一块 发布时间: 2016/07/27 16:22 阅读: 895 收藏: 4 点赞: 4 评论: 2 摘要 Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 搭建web服务器 文件保存时自动重载浏览器 使用预处理器如Sass.LESS 优化资源,比如压缩CSS.JavaScript.压缩图片 当然Gulp能做的远不止这些.如果你够疯狂,你甚至可以使用它搭建一个静态页面生成器.Gulp真的足够强大,但你必须学会驾驭它. 这是这篇文章的主要目的.帮

Grunt靠边,全新的建构工具来了.Gulp的code-over-configuration不只让撰写任务(tasks)更加容易,也更好阅读及维护. Glup使用node.js串流(streams)让建构更快速,不须写出资料到硬盘的暂存档案/目录.如果你想了解更多有关串流–虽然不是必须的–你可以阅读这篇文章.Gulp利用来源档案当作输入,串流到一群外挂(plugins),最后取得输出的结果,并非配置每一个外挂的输入与输出–就像Grunt.让我们来看个范例,分别在Gulp及Grunt建构Sass:

最近,因为校友网项目开始有些规模了.开始就要考虑对静态资源进行工程自动化的管理.一讲到前端的自动化工具,大家或许都会想到Grunt,Gulp,或者百度的FIS.这三个都有各自的特点,大家可以依据自己的喜好,选择工具.至于为什么选择Gulp,因为Grunt的gruntfile配置真的很头大好吗!简直看到头晕晕,但是还是有不少人喜欢这种方式的.然后FIS真心很强大,你所需要的,基本它都提供了,并且做得很好很简单,如果你急于马上使用可以赶紧去看看.而我为什么不用呢,感觉可能是因为,有点黑盒子?哈哈哈.

1. npm install gulp -g    全局安装  npm install gulp --save-dev  安装文件内,纪录于package.json     接著安装插件,完成下列任务: 编译Sass (gulp-ruby-sass) Autoprefixer (gulp-autoprefixer) 缩小化(minify)CSS (gulp-minify-css) JSHint (gulp-jshint) 拼接 (gulp-concat) 丑化(Uglify) (gulp-ugl

原文来自于:http://www.techug.com/gulp Grunt靠边,全新的建构工具来了.Gulp的code-over-configuration不只让撰写任务(tasks)更加容易,也更好阅读及维护. Glup使用node.js串流(streams)让建构更快速,不须写出资料到硬盘的暂存档案/目录.如果你想了解更多有关串流–虽然不是必须的–你可以阅读这篇文章.Gulp利用来源档案当作输入,串流到一群外挂(plugins),最后取得输出的结果,并非配置每一个外挂的输入与输出–就像Gr