后面咱们讲到在学习压缩 JS、CSS、图片等文件时,须要用到一些相干的插件。Gulp 提供了一些有用的插件来解决 HTML 和 CSS,JavaScript,图形以及一些其余内容。上面咱们来看一下 gulp 中的一些不同类型插件。

HTML和CSS插件

插件形容
autoprefixer主动蕴含 CSS 属性的前缀
gulp-browser-sync用于监督 CSS 目录中的所有 HTML 和 CSS 文件,并在文件更改时对所有浏览器中的页面执行实时从新加载
gulp-useref用于替换对非优化脚本或样式表的援用
gulp-email-design创立 HTML 电子邮件模板,将 CSS 款式转换为内联
gulp-uncss优化 CSS 文件和查找未应用和反复的款式
gulp-csso是一个 CSS 优化器,能够最小化 CSS 文件,从而放大文件大小
gulp-htmlmin最小化 HTML 文件
gulp-csscomb用于制作 CSS 的款式格式化程序
gulp-csslint它指定一个 CSS linter
gulp-htmlhint指定一个 HTML 验证器

JavaScript插件

插件形容
gulp-autopolyfiller它与 autoprefixer 雷同,包含 JavaScript 的必要 polyfill
gulp-jsfmt用于搜寻特定的代码段
gulp-jscs用于查看 JavaScript 代码款式
gulp-modernizr指定了用户浏览器提供的 HTML,CSS 和 JavaScript 性能
gulp-express启动了gulp express.js 网络服务器
gulp-requirejs应用 require. js 将 require.js AMD 模块组合成一个文件
gulp-plato生成复杂性剖析报告
gulp-complexity剖析了代码的复杂性和可维护性
fixmyjs修复了 JSHint 的后果
gulp-jscpd用作源代码的复制/粘贴检测器
gulp-jsonlint是 JSON 验证器
gulp-uglify放大了 JavaScript 文件
gulp-concat连贯 CSS 文件

单元测试插件

插件形容
gulp-nodeunit运行 Gulp 的节点单元测试
gulp-jasmine用于报告与输入相干的问题
gulp-qunit为 QUnit 测试提供根本的控制台输入,并应用 PhantomJS 节点模块和 PhantomJS 运行器 QUnit 插件
gulp-mocha指定了 Mocha 四周的薄包装并运行 Mocha 测试
gulp-karma已在 Gulp 中弃用

图形插件

插件形容
gulpicon从 SVG 生成精灵并将它们转换为 PNG
gulp-iconfont与 Web 字体一起用于从 SVG 创立 WOFF,EOT,TTF 文件
gulp-imacss将图像文件转换为数据 URI 并将它们放入单个 CSS 文件中
gulp-responsive为不同的设施生成响应式图像
gulp-sharp它用于更改和调整图像的方向和背景
gulp-svgstore将 SVG 文件与元素组合成一个文件
gulp-imagemin&gulp-tinypng用于压缩 PNG,JPEG,GIF,SVG 等图像
gulp-spritesmith用于从一组图像和 CSS 变量创立 spritesheet

编译器插件

插件形容
gulp-less为 Gulp 提供了大量插件
gulp-sass为 Gulp 提供 SASS 插件
gulp-compass为 Gulp 提供指南针插件
gulp-stylus用于将手写笔保留在 CSS 中
gulp-coffee为 Gulp 提供 coffeescript 插件
gulp-handlebars为 Gulp 提供了把手插件
gulp-jst在 JST 中提供下划线模板
gulp-react将 Facebook React JSX 模板指定为 JavaScript
gulp-nunjucks在 JST 中指定 Nunjucks 模板
gulp- dustjs在 JST 中指定了 Dust 模板
gulp-angular-templatecache在 templateCache 中指定 AngularJS 模板

其余插件

gulp-clean 插件删除文件和文件夹,gulp-copy 插件将文件从源文件复制到新目的地。

插件形容
gulp-grunt从 Gulp 运行 Grunt 工作
gulp-watch无论何时进行更改,它都会监督文件
gulp-notify只有工作失败,它就会告诉谬误音讯
gulp-git它容许应用 Git 命令.
gulp-jsdoc为 Gulp 创立 JavaScript 文档
gulp-rev它提供对文件名的动态资产订正
gulp-bump减少了 JSON 包中的版本
gulp-bower-files用于注入凉亭包
gulp-removelogs删除了 console.log 语句
gulp-preprocess依据上下文或环境配置预处理 HTML,JavaScript 和其余文件
gulp-connect它用于运行 LiveReload 的 Web 服务器
gulp-shell运行 Shell 命令
gulp-ssh应用 SSH 和 SFTP 工作进行连贯
gulp-zip它压缩文件和文件夹
gulp-util为 gulp 插件提供实用工具
gulp-filesize它以人类可读的格局指定文件大小