Gulp插件使用技巧
目录:
一、插件的安装卸载
安装:
npm install gulp-less --save-dev
卸载
npm uninstall gulp-less --save-dev
二、插件使用的基本流程
1.创建gulpfile.js
2.创建package.json
3.安装gulp到项目
4.安装插件到项目
5.使用插件
6.运行看效果
实例:
三、拆分任务
//任务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插件使用技巧的更多相关文章
- 常用 Gulp 插件汇总 —— 基于 Gulp 的前端集成解决方案(三)
前两篇文章讨论了 Gulp 的安装部署及基本概念,借助于 Gulp 强大的 插件生态 可以完成很多常见的和不常见的任务.本文主要汇总常用的 Gulp 插件及其基本使用,需要读者对 Gulp 有一个基本 ...
- gulp 插件
原文链接:http://www.mamicode.com/info-detail-517085.html gulp是什么? http://gulpjs.com/ 相信你会明白的! 与著名的构建工具gr ...
- gulp插件(gulp-jmbuild),用于WEB前端构建
源码地址:https://github.com/jiamao/gulp-jmbuild https://github.com/jiamao/gulp-jmbuild gulp-jmbuild gulp ...
- gulp插件gulp-usemin简单使用
关于什么是gulp,它和grunt有什么区别等问题,这里不做任何介绍.本文主要介绍如何使用gulp-usemin这款插件,同时也会简单介绍本文中用到的一些插件. 什么是gulp-usemin 用来将H ...
- 使用gulp插件来自动刷新页面。
http://itakeo.com/blog/2016/05/19/gulpreload/?none=123 使用gulp插件来自动刷新页面.再也不用修改一次,按一下F5了. 首选通过npm inst ...
- 将less编译成css的gulp插件
简介:gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以很愉快的编写代码, ...
- 如何编写一个gulp插件
很久以前,我们在"细说gulp"随笔中,以压缩JavaScript为例,详细地讲解了如何利用gulp来完成前端自动化. 再来短暂回顾下,当时除了借助gulp之外,我们还利用了第三方 ...
- Gulp 插件及其使用
前端现在有很多的自动打包工具,各有优缺点,而gulp作为其中的一员,也有着很受人们的青睐,简单粗暴,然而gulp本身并没有提供很多的API,真正的一些工作则是靠着插件完成的,本文简单介绍一些常用的gu ...
- gulp插件构建项目 压缩js、css、image、zip、web服务、跨域等插件
推荐一个很好文: https://github.com/lin-xin/blog/issues/2 匹配符 *.**.!.{} gulp.src('./js/*.js') // * 匹配js文件夹下所 ...
随机推荐
- Jmeter中的逻辑控制器(四)
Jmeter中的逻辑控制器 (Logic Controller) [线程组]右键—>[添加]—>[逻辑控制器] 简单控制器(Simple Controller ) 没有特殊功能,目的是形成 ...
- DB2和Oracle中Date比较
- csu 1555(线段树经典插队模型-根据逆序数还原序列)
1555: Inversion Sequence Time Limit: 2 Sec Memory Limit: 256 MBSubmit: 469 Solved: 167[Submit][Sta ...
- gtk+学习笔记(三)
gtk感觉函数好多,需要记好多函数,还是多练习,多总结,今天写了一个登陆窗口,很简单,主要是为了加深对这些东西的记忆,直接贴代码 #include<gtk/gtk.h> static Gt ...
- Source Insight 4.0 文件类型、编码格式、tab转空格、tab键自动补全设置。。。
1.编码格式 -- 在 Options->Preferences->Files 中的最下面,Default enconding 为 UTF-8 2.tab转空格 其他相关设置如下: 以下 ...
- nginx配置tomcat集群
显示nginx的核心配置 #user nobody;worker_processes 1; events { worker_connections 1024; #并发连接数} http { in ...
- thinkphp5 返回数组提示variable type error: array
浏览器访问控制器函数,而函数返回的是数组: function timeArr(){ $time = array(); for($i=1;$i<=7;$i++){ $d= date('d',Tim ...
- day1作业二:多级菜单
作业二:多级菜单 1.三级菜单 2.可以次选择进入各子菜单 3.所需新知识点:列表.字典 4.打印b回到上一层 5.打印q退出循环 流程图如下: readme: (1)存储三级菜单的字典;设置 ...
- Linux文件访问和日志
一.文件系统创建一个文件的过程假设我们想要新增一个文件,此时文件系统的行为是:先确定用户对于欲新增文件的目录是否具有 w 与 x 的权限,若有的话才能新增:根据 inode bitmap 找到没有使用 ...
- 小甲鱼Python笔记(下)
二十八 二十九 文件 打开文件 open(文件名[,模式][,缓冲]) 注意open是个函数不是方法 模式: 缓冲: 大于1的数字代表缓冲区的大小(单位是字节),-1(或者是任何负数)代表使用默认缓 ...