Fork me on GitHub

gulp常用插件汇总

gulp常用插件汇总:

点击模块、库名字,查看使用文档

  1. node常用模块汇总
  2. webpack常用插件、loader汇总
  3. gulp常用插件汇总
  4. jQuery常用插件汇总
  5. Python常用模块、库汇总

  • browser-sync: 省时的浏览器同步测试工具,多设备、多屏幕自动刷新页面
  • http-proxy-middleware : 解决本地开发代理跨域请求插件
  • autoprefixer: 根据定制的兼容规则给css添加浏览器前缀插件
  • wiredep: wiredep解决了bower前端库引入进html中的问题
  • del: 删除文件及文件夹
  • yargs: Node中处理命令行参数的通用解决方案,只要一句代码 var args = require('yargs').argv;就可以让命令行的参数都放在变量args上,可以根据参数判断是测试环境还是正式环境。
  • gulp-load-plugins: 批量引入package.json文件中的依赖项
  • gulp-plumber: 防止因gulp插件的错误而导致管道中断,plumber可以阻止 gulp 插件发生错误导致进程退出并输出错误日志。
  • gulp-notify:gulp通知插件
  • gulp-sourcemaps: 用来生成映射文件的一个插件,SourceMap 文件记录了一个存储源代码与编译代码对应位置映射的信息文件。我们在调试时都是没办法像调试源码般轻松,这就需要 SourceMap 帮助我们在控制台中转换成源码,从而进行 debug。
  • gulp-useref: 可以将HTML引用的多个CSS和JS合并起来,减小依赖的文件个数,从而减少浏览器发起的请求次数。gulp-useref根据注释将HTML中需要合并压缩的区块找出来,对区块内的所有文件进行合并。注意:它只负责合并,不负责压缩!
  • gulp-rev:为静态文件随机添加一串hash值, 解决cdn缓存问题, a.css --> a-d2f3f35d3.css。根据静态资源内容,生成md5签名,打包出来的文件名会加上md5签名,同时生成一个json用来保存文件名路径对应关系。
  • gulp-rev-collector:根据gulp-rev生成的manifest.json文件中的映射, 去替换文件名称, 也可以替换路径。
  • gulp-rev-rewrite:重写对由gulp-rev修订的资产的引用
  • gulp-rev-css-url:用于在gulp-rev之后,用修订后的URL覆盖CSS文件中的URL
  • gulp-rev-outdated:旧的静态资产修订文件过滤器
  • gulp-rev-delete-original:删除由gulp-revgulp-rev-all重写的原始文件 。
  • rev-del:这是一款从模块(如gulp-rev)生成的修订清单中删除旧的、未使用的指纹文件。
  • gulp-rev-format:提供静态资产的哈希格式选项(前缀,后缀,最后扩展名)
  • gulp-imagemin: 缩小PNG,JPEG,GIF和SVG图像的插件
  • gulp-cache:这是一款基于临时文件的gulp缓存代理任务。
  • gulp-filter: 可以把stream里的文件根据一定的规则进行筛选过滤。比如gulp.src中传入匹配符匹配了很多文件,可以把这些文件pipe给gulp-filter作二次筛选
  • gulp-inject:这个插件的作用与wiredep类似,不同的是可以自己任意指定需要插入文件的列表。它同样是利用注释来寻找插入的位置。
  • gulp-replace:gulp3的字符串替换插件
  • gulp-htmlmin:这是一款HTML文件压缩插件
  • gulp-if:这是一款条件判断插件
  • gulp-size:显示项目的大小插件
  • gulp-uglify:使用UglifyJS缩小js文件
  • gulp-beautify:这是一款使用js-beautify进行资产美化插件
  • pump:这是一款小型节点模块,可将流连接在一起并在其中一个关闭时将其全部销毁
  • gulp-postcss:通过多个插件通过管道传递CSS,但是仅解析一次CSS。
  • cssnano:这是一款将你的 CSS 文件做 多方面的的优化,以确保最终生成的文件 对生产环境来说体积是最小的插件
  • gulp-babel:Babel的Gulp插件
  • gulp-eslint:一个用于识别和报告在ECMAScript/JavaScript代码中找到的模式的Gulp插件。
  • modernizr:这是一款JavaScript 库,用于检测用户浏览器的 HTML5 与 CSS3 特性。
posted @ 2019-12-10 17:26  较瘦  阅读(4783)  评论(0编辑  收藏  举报
知识点文章整理