目录:

  1. 插件的安装卸载
  2. 插件使用的基本流程
  3. 拆分任务
  4. 监听
  5. 默认任务

一、插件的安装卸载

安装:

npm install gulp-less --save-dev

卸载

npm uninstall gulp-less --save-dev

二、插件使用的基本流程

1.创建gulpfile.js

2.创建package.json

3.安装gulp到项目

4.安装插件到项目

5.使用插件

6.运行看效果

实例:

Gulp插件autoprefixer的使用

Gulp插件less的使用

三、拆分任务

//任务mincss
gulp.task('mincss', function() {
//...
}); //任务minjs
gulp.task('minjs', function() {
//...
});

运行:

gulp minjs

则仅会执行minjs的任务

四、监听

gulp.task('do', function() {
//....
}); //监听less下所有less文件,有变化则启动do任务
gulp.task('watch', function() {
gulp.watch('./less/*.less', ['do']);
});

五、默认任务

gulp.task('default', function() {
//命令输入gulp自动执行这里的任务
});

一般在default写入监听

//调试用:监听任务
gulp.task('watch', function() {
gulp.watch('./less/*.less', ['do']);
}); gulp.task('default',['watch']);

Gulp插件使用技巧的更多相关文章

  1. 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)

    前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...

  2. gulp 插件

    原文链接:http://www.mamicode.com/info-detail-517085.html gulp是什么? http://gulpjs.com/ 相信你会明白的! 与著名的构建工具gr ...

  3. gulp插件(gulp-jmbuild),用于WEB前端构建

    源码地址:https://github.com/jiamao/gulp-jmbuild https://github.com/jiamao/gulp-jmbuild gulp-jmbuild gulp ...

  4. gulp插件gulp-usemin简单使用

    关于什么是gulp,它和grunt有什么区别等问题,这里不做任何介绍.本文主要介绍如何使用gulp-usemin这款插件,同时也会简单介绍本文中用到的一些插件. 什么是gulp-usemin 用来将H ...

  5. 使用gulp插件来自动刷新页面。

    http://itakeo.com/blog/2016/05/19/gulpreload/?none=123 使用gulp插件来自动刷新页面.再也不用修改一次,按一下F5了. 首选通过npm inst ...

  6. 将less编译成css的gulp插件

    简介:gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码, ...

  7. 如何编写一个gulp插件

    很久以前,我们在"细说gulp"随笔中,以压缩JavaScript为例,详细地讲解了如何利用gulp来完成前端自动化. 再来短暂回顾下,当时除了借助gulp之外,我们还利用了第三方 ...

  8. Gulp 插件及其使用

    前端现在有很多的自动打包工具,各有优缺点,而gulp作为其中的一员,也有着很受人们的青睐,简单粗暴,然而gulp本身并没有提供很多的API,真正的一些工作则是靠着插件完成的,本文简单介绍一些常用的gu ...

  9. gulp插件构建项目 压缩js、css、image、zip、web服务、跨域等插件

    推荐一个很好文: https://github.com/lin-xin/blog/issues/2 匹配符 *.**.!.{} gulp.src('./js/*.js') // * 匹配js文件夹下所 ...

随机推荐

  1. 用 python 来操作 docx, xlsx 格式文件(二)(使用 docx 库操作 docx 格式文件

    docx 库 文章结构: 一.docx 基本用,创建 docx 文件并添加数据 二.深入理解文本格式(format),并设置所格式属性(attribute) 三.深入理解样式(styles),以及如何 ...

  2. 打开Office2007弹出“向程序发送命令时出现问题” 解决方案

    打开Office2007弹出“向程序发送命令时出现问题” 解决方案,试了很多方案,最终还是这种方法帮我解决了问题,分享下,以下地址便是: http://club.excelhome.net/threa ...

  3. you have to first modify the default Eclipse configuration to avoid XML cosmetic errors:

    Configure XML Validation to Avoid Cosmetic Errors Navigate to: Window->Preferences->XML->XM ...

  4. Codeforces Round #491 (Div. 2) E - Bus Number + 反思

    E - Bus Number 最近感觉打CF各种车祸.....感觉要反思一下, 上次读错题,这次想当然地以为18!肯定暴了longlong 而没有去实践, 这个题我看到就感觉是枚举每个数字的个数,但是 ...

  5. 微软企业库5.0 学习之路——扩展学习篇、库中的依赖关系注入(重构 Microsoft Enterprise Library)[转]

    这篇文章是我在patterns & practices看到的一篇有关EntLib5.0的文章,主要介绍了EntLib5.0的这次的架构变化由来,觉得很不错,大家可以看一下! 在过去几年中,依赖 ...

  6. laravel windows安装(composer)

    1.安装composer参考windows 安装tp5 composer方式 2.先配置好本地虚拟域名,在cmd里面切换到网站根目录 ... 3.安装成功之后,在浏览器输入已配置的虚拟域名我的是,la ...

  7. Java Stream简介, 流的基本概念

    在Javaor .net编程中,  我们经常见到"stream" 这个字眼. 我们大概知道这是个流的意思, 如果看完本文的话, 应该会有1个大概的概念. 一, Java中什么是St ...

  8. linux下php pcntl_fork模拟多线程

    开始用php写后台服务一段时间了.也是在这样的驱动下,不断的学习php语法,体验这一原来一直以为神秘且敬而远之的神奇语言的魅力.最初看php多线程的资料是为了提高程序的处理能力,充分发挥linux多任 ...

  9. Java 深入浅出String

    String String是一个被final修饰的类,直接继承于Object,同时也实现了charsequence接口,String被声明为final也就不可以被继承了.由于String的方法比较多, ...

  10. React Native 系列(六)

    前言 本系列是基于React Native版本号0.44.3写的.在我们之前的通过props实现组件间传值的时候,大家有没有发现在父组件传递值过去,在子控件获取props的时候没有提示,那么如何能实现 ...