本文主要展示的是gulp常用插件的使用方法和用途,通过对插件的熟练运用达到精通gulp.不定期更新.可以到github上面下载DEMO. github地址:lin-xin/gulp-plugins 匹配符 *.**.!.{} gulp.src('./js/*.js') // * 匹配js文件夹下所有.js格式的文件 gulp.src('./js/**/*.js') // ** 匹配js文件夹的0个或多个子文件夹 gulp.src(['./js/*.js','!./js/index.js']) /…

/** * 1. LESS编译 压缩 合并 * 2. JS合并 压缩 混淆 * 3. img复制 * 4. html压缩 */ // 在gulpfile中先载入gulp包,因为这个包提供了一些APIvar gulp = require('gulp');var less = require('gulp-less');var cssnano = require('gulp-cssnano'); // 1. LESS编译 压缩 --合并没有必要,一般预处理CSS都可以导包gulp.task('styl…

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-uglify这是一款使用UglifyJS缩小js文件. 更多使用文档请点击访问gulp-uglify工具官网. 安装 一键安装不多解释 npm install --save-dev gulp-uglify 使用 var gulp = require('gulp'); var uglify = require('gulp-uglify'); var pipeline = require('readable-stream').pipel…

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-if这是一款条件判断插件. 注意:与gulp-if一起使用时,表现不佳的插件通常会变得更糟.通常,修复不在gulp-if中. 注意:与lazypipe一起使用时效果很好,请参见下文 更多使用文档请点击访问gulp-if工具官网. 安装 一键安装不多解释 npm install --save-dev gulp-if 使用 /** * @param condition {Boolen} 判断条件或glob条件 * @param stre…

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-inject这个插件的作用与wiredep类似,不同的是可以自己任意指定需要插入文件的列表.它同样是利用注释来寻找插入的位置.获取源文件流,将每个文件转换为字符串,并将每个转换后的字符串注入目标流文件中的占位符. 更多使用文档请点击访问gulp-inject工具官网. 同样是利用注释来寻找插入的位置,它识别的默认注释为,但更加智能: 支持各种模板语言:可以根据gulp.src指定的源文件自动识别注释和插入内容,除了支持HTML外,还…

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-filter这是一款可以把stream里的文件根据一定的规则进行筛选过滤. 更多使用文档请点击访问gulp-filter工具官网. 安装 一键安装不多解释 npm install --save-dev gulp-filter 使用 gulp.src中传入匹配符匹配了很多文件,可以把这些文件pipe给gulp-filter做二次筛选.如:gulp.src('**/*.js').pipe($.filter(**/a/*.js)),本来选…

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-rev-collector这是一款根据gulp-rev生成的manifest.json文件中的映射, 去替换文件名称, 也可以替换路径. 更多使用文档请点击访问gulp-rev-collector工具官网. 安装 一键安装不多解释 npm install --save-dev gulp-rev-collector 使用 我们可以使用gulp-rev来缓存破坏多个资产并为其生成清单文件.然后,使用gulp-rev-collector,…

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-useref这是一款可以将HTML引用的多个CSS和JS合并起来,减小依赖的文件个数,从而减少浏览器发起的请求次数.gulp-useref根据注释将HTML中需要合并压缩的区块找出来,对区块内的所有文件进行合并.注意:它只负责合并,不负责压缩!,如果需要做其他操作,可以配合gulp-if插件使用. 更多使用文档请点击访问gulp-useref工具官网. 安装 一键安装不多解释 npm install --save-dev gulp-…

更多gulp常用插件使用请访问:gulp常用插件汇总 gulp-plumber这是一款防止因gulp插件的错误而导致管道中断,plumber可以阻止 gulp 插件发生错误导致进程退出并输出错误日志. 更多使用文档请点击访问gulp-plumber工具官网. 安装 npm install --save-dev gulp-plumber 使用 var plumber = require('gulp-plumber'); var coffee = require('gulp-coffee'); gu…

更多gulp常用插件使用请访问:gulp常用插件汇总 ** gulp-eslint**这是一个用于识别和报告在ECMAScript/JavaScript代码中找到的模式的Gulp插件.. 更多使用文档请点击访问gulp-eslint工具官网. 安装 一键安装不多解释 npm install --save-dev gulp-eslint 使用 基础使用: const {src, task} = require('gulp'); const eslint = require('gulp-eslint…