1. 全局安装gulp

    $npm install --global gulp
  2. 作为项目的开发依赖安装
    //--save-dev 开发依赖,储存在package.json的devDependencies中,如gulp,grunt
    //--save 发布之后的依赖,储存在package.json的dependencies中,如jquery,angular $ npm install --save-dev gulp
  3. 在项目下创建一个gulpfile.js文件
    var gulp = require('gulp');
    
    gulp.task('default', function() {
    // 将你的默认的任务代码放在这
    });
  4. 运行gulp
    $ gulp
    
    //运行default的task,如果单独执行task,  gulp <task> <othertask>
  5. 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']);
    });
  6. 引入模块
    //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 基础运用的更多相关文章

  1. gulp基础操作实践

    按照gulp中文文档对gulp基础操作的一些实践练习,记录以防忘掉. 一,选择并输出文件:gulp.src(globs[,options]) eg:gulp.src('src/less/index.l ...

  2. Gulp基础

    1.什么是gulp? gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器. 2.为什么使用gulp? gulp不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工 ...

  3. gulp基础使用总结

    gulp 安装 1 检测电脑有没有安装node 执行 $ node -v $ npm -v 如果没有安装的话,可以到https://nodejs.org/en/download/下载安装. 2 全局安 ...

  4. Gulp基础知识

    首先,我们需要了解Gulp能做些什么? 编译 sass                                        sass是什么?(使CSS可以用编程的方式写,加快我们开发的速度) ...

  5. gulp.基础

    1.安装 全局安装 npm install --global gulp 作为项目的开发依赖安装 npm install gulp --save-dev 2.在根目录下创建一个名为gulpfile.js ...

  6. gulp基础使用及进阶

    提示:路径中不允许出现中文,否则scss编译会出错,大概. 按照惯例,先检查一下Node.js.npm(cnpm).gulp的版本号 1.新建package.json 我们可以通过手动新建这个配置文件 ...

  7. 【gulp】工作中的实战

    写这篇文章的目的是为了以后的项目中懒得再去配gulp,直接可以拿这篇博客中的来用,因为有时候配置还是挺烦人的. gulp相关插件的介绍 用法比较简单,假设大家都会用gulp,下面主要介绍一下一些插件的 ...

  8. Gulp真实项目用例

    包括了less预编译,css压缩,html文件include引入,js混淆压缩,本地开发热刷新服务器,html压缩,版本号添加 github地址: gulpfile.js var gulp = req ...

  9. gulp学习-gulpfile

    安装gulp 假设已经安装了node 和npm (淘宝的cnpm很适合国内使用). 1.首页全局安装gulp. 1 npm install --global gulp 2.其次局部安装gulp.(注: ...

随机推荐

  1. nginx做负载均衡配置文件

    nginx做负载均衡是在反向代理的基础上做的,代码如下: ## Basic reverse proxy server ## ## Apache backend for www.baidu.com ## ...

  2. Eclipse中查看Android模拟器SD卡目录

    · 有时候用到Android模拟器来模拟SD卡相关操作,在Eclipse中可以直接查看SD卡目录: 首先,新建模拟器的时候要创建SD卡,存储的大小根据需要创建: 启动模拟器,在Eclipse中打开视图 ...

  3. 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 ...

  4. 对C#中的web访问mysql数据库的一些知识点进行了整理归纳总结

    基本对比 使用方式 使用场合 优缺点 是否需要安装 需要的dll网址 引用方式 程序内引用 程序初期确定使用MySql,前期添加引用 大多数情况下使用在类文件内,多数使用于aspx,ashx等带有后置 ...

  5. xml--通过jdom解析及生产XML

    JDOM是一种使用 XML 的独特 Java 工具包,用于快速开发 XML 应用程序.它的设计包含 Java 语言的语法乃至语义. JAXP (用于 XML 语法分析的 Java API)包含了三个软 ...

  6. IMX51启动模式

    相关链接: http://blog.csdn.net/kickxxx/article/details/7236040 http://blog.csdn.net/evilcode/article/det ...

  7. JavaBean个人总结

    JavaBean在JSP程序中的应用 JavaBean是为Java语言设计的软件组件模型,具有可重复使用和跨平台的特点.可以通过JavaBean来封装业务逻辑,进行数据库操作等,从而很好的实现业务逻辑 ...

  8. 逆序对的相关问题:bzoj1831,bzoj2431

    先从简单一点的bzoj2431入手: n个数1~n已经限定了,所以 对于1~i-1,新加入i,最多可以增加i-1个逆序对,最少增加0个逆序对 f[i,j]表示1~i形成的序列逆序对为j的方案数 比较容 ...

  9. ASP.NET 中OAUTH 2.0 及OPENID CONNECT的介绍

        了解以下内容对ASP.NET 5中的验证中间件应用有很大帮助! OAUTH2是目前很多大型网站都使用的对外提供开放资源接口的应用标准,比入taobao\alipay\腾讯\豆瓣等.它和目前的另 ...

  10. 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没有提供内置的支持 ...