gulp 基础运用
- 全局安装gulp
$npm install --global gulp
- 作为项目的开发依赖安装
//--save-dev 开发依赖,储存在package.json的devDependencies中,如gulp,grunt
//--save 发布之后的依赖,储存在package.json的dependencies中,如jquery,angular $ npm install --save-dev gulp - 在项目下创建一个gulpfile.js文件
var gulp = require('gulp'); gulp.task('default', function() {
// 将你的默认的任务代码放在这
}); - 运行gulp
$ gulp //运行default的task,如果单独执行task, gulp <task> <othertask>
- api
//默认的,task 将以最大的并发数执行,也就是说,gulp 会一次性运行所有的 task 并且不做任何等待。若要顺序执行,建立依赖
var gulp = require('gulp'); // 返回一个 callback,因此系统可以知道它什么时候完成
gulp.task('one', function(cb) {
console.log(1);
}); // 定义一个所依赖的 task 必须在这个 task 执行之前完成
gulp.task('two', ['one'], function() {
console.log(2);
}); gulp.task('default', ['one', 'two']); //gulp.src 输出符合匹配的文件,通过.pipe执行压缩合并等操作
//gulp.desk 能被 pipe 进来,并且将会写文件。并且重新输出所有数据,因此你可以将它 pipe 到多个文件夹。如果某文件夹不存在,将会自动创建它。
gulp.src('client/templates/*.jade')
.pipe(jade())
.pipe(minify())
.pipe(gulp.dest('build/minified_templates')); //gulp.watch 监听事件并且可以在文件发生改动时候做一些事情。它总会返回一个 EventEmitter 来发射change 事件。 gulp.task('watch', function () {
//监听app/assets 下的所有二级目录中的所有.less文件,发生改变,执行名为less的task文件
gulp.watch('app/assets/**/*.less', ['less']);
}); - 引入模块
//connect静态服务器
var connect = require("gulp-connect"); // 合并文件模块
var concat = require('gulp-concat'); //less编译模块
var less = require('gulp-less'); //压缩js
var uglify = require('gulp-uglify');
//压缩css
var minifyCss = require('gulp-minify-css');
//压缩html
var minifyHtml = require('gulp-minify-html'); //项目中需要将.less文件重命名为.css var rename = require('gulp-rename'); //jshint检查js静态语法检查
var jshint = require('gulp-jshint');
gulp 基础运用的更多相关文章
- gulp基础操作实践
按照gulp中文文档对gulp基础操作的一些实践练习,记录以防忘掉. 一,选择并输出文件:gulp.src(globs[,options]) eg:gulp.src('src/less/index.l ...
- Gulp基础
1.什么是gulp? gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器. 2.为什么使用gulp? gulp不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工 ...
- gulp基础使用总结
gulp 安装 1 检测电脑有没有安装node 执行 $ node -v $ npm -v 如果没有安装的话,可以到https://nodejs.org/en/download/下载安装. 2 全局安 ...
- Gulp基础知识
首先,我们需要了解Gulp能做些什么? 编译 sass sass是什么?(使CSS可以用编程的方式写,加快我们开发的速度) ...
- gulp.基础
1.安装 全局安装 npm install --global gulp 作为项目的开发依赖安装 npm install gulp --save-dev 2.在根目录下创建一个名为gulpfile.js ...
- gulp基础使用及进阶
提示:路径中不允许出现中文,否则scss编译会出错,大概. 按照惯例,先检查一下Node.js.npm(cnpm).gulp的版本号 1.新建package.json 我们可以通过手动新建这个配置文件 ...
- 【gulp】工作中的实战
写这篇文章的目的是为了以后的项目中懒得再去配gulp,直接可以拿这篇博客中的来用,因为有时候配置还是挺烦人的. gulp相关插件的介绍 用法比较简单,假设大家都会用gulp,下面主要介绍一下一些插件的 ...
- Gulp真实项目用例
包括了less预编译,css压缩,html文件include引入,js混淆压缩,本地开发热刷新服务器,html压缩,版本号添加 github地址: gulpfile.js var gulp = req ...
- gulp学习-gulpfile
安装gulp 假设已经安装了node 和npm (淘宝的cnpm很适合国内使用). 1.首页全局安装gulp. 1 npm install --global gulp 2.其次局部安装gulp.(注: ...
随机推荐
- nginx做负载均衡配置文件
nginx做负载均衡是在反向代理的基础上做的,代码如下: ## Basic reverse proxy server ## ## Apache backend for www.baidu.com ## ...
- Eclipse中查看Android模拟器SD卡目录
· 有时候用到Android模拟器来模拟SD卡相关操作,在Eclipse中可以直接查看SD卡目录: 首先,新建模拟器的时候要创建SD卡,存储的大小根据需要创建: 启动模拟器,在Eclipse中打开视图 ...
- svn:revert to this version 和 revert changes from this version的区别 假设我们有许多个版本,版本号分别是1-10
假设我们有许多个版本,版本号分别是1-10 如果我们在7这里选择revert to this version那么7之后的8,9,10的操作都会被消除 如果在7选择revert changes from ...
- 对C#中的web访问mysql数据库的一些知识点进行了整理归纳总结
基本对比 使用方式 使用场合 优缺点 是否需要安装 需要的dll网址 引用方式 程序内引用 程序初期确定使用MySql,前期添加引用 大多数情况下使用在类文件内,多数使用于aspx,ashx等带有后置 ...
- xml--通过jdom解析及生产XML
JDOM是一种使用 XML 的独特 Java 工具包,用于快速开发 XML 应用程序.它的设计包含 Java 语言的语法乃至语义. JAXP (用于 XML 语法分析的 Java API)包含了三个软 ...
- IMX51启动模式
相关链接: http://blog.csdn.net/kickxxx/article/details/7236040 http://blog.csdn.net/evilcode/article/det ...
- JavaBean个人总结
JavaBean在JSP程序中的应用 JavaBean是为Java语言设计的软件组件模型,具有可重复使用和跨平台的特点.可以通过JavaBean来封装业务逻辑,进行数据库操作等,从而很好的实现业务逻辑 ...
- 逆序对的相关问题:bzoj1831,bzoj2431
先从简单一点的bzoj2431入手: n个数1~n已经限定了,所以 对于1~i-1,新加入i,最多可以增加i-1个逆序对,最少增加0个逆序对 f[i,j]表示1~i形成的序列逆序对为j的方案数 比较容 ...
- ASP.NET 中OAUTH 2.0 及OPENID CONNECT的介绍
了解以下内容对ASP.NET 5中的验证中间件应用有很大帮助! OAUTH2是目前很多大型网站都使用的对外提供开放资源接口的应用标准,比入taobao\alipay\腾讯\豆瓣等.它和目前的另 ...
- SQL SERVER 2000 & SQL SERVER 2005 数据缓存依赖
一.SQL SERVER 7.0/2000和SQL SERVER 2005的简介及比较 1.1 SQL SERVER 7.0/2000 SQL SERVER 7.0/2000没有提供内置的支持 ...