目录

当前位置：首页 > 文档资料 > Gulp 入门教程 >

有用的插件（Useful Plugins）

优质

小牛编辑

118浏览

2023-12-01

Gulp提供了一些有用的插件来处理HTML和CSS，JavaScript，Graphics以及下表中描述的其他一些内容。

HTML和CSS插件

Sr.No.	插件和说明
1	autoprefixer 它自动包含CSS属性的前缀。
2	gulp-browser-sync 它用于监视CSS目录中的所有HTML和CSS文件，并在文件更改时对所有浏览器中的页面执行实时重新加载
3	gulp-useref 它用于替换对非优化脚本或样式表的引用。
4	gulp-email-design 它创建HTML电子邮件模板，将CSS样式转换为内联。
5	gulp-uncss 它优化CSS文件并查找未使用和重复的样式。
6	gulp-csso 它是一个CSS优化器，可以最小化CSS文件，从而缩小文件大小。
7	gulp-htmlmin 它最小化HTML文件。
8	gulp-csscomb 它用于制作CSS的样式格式化程序。
9	gulp-csslint 它指定了一个CSS linter。
10	gulp-htmlhint 它指定了一个HTML验证器。

JavaScript插件

Sr.No.	插件和说明
1	gulp-autopolyfiller 它与autoprefixer相同，包括JavaScript的必要polyfill。
2	gulp-jsfmt 它用于搜索特定的代码片段。
3	gulp-jscs 它用于检查JavaScript代码样式。
4	gulp-modernizr 它指定了用户浏览器提供的HTML，CSS和JavaScript功能。
5	gulp-express 它启动gulp express.js web服务器。
6	gulp-requirejs 它使用require.js将require.js AMD模块组合到一个文件中。
7	gulp-plato 它生成复杂性分析报告。
8	gulp-complexity 它分析了代码的复杂性和可维护性。
9	fixmyjs 它修复了JSHint的结果。
10	gulp-jscpd 它用作源代码的复制/粘贴检测器。
11	gulp-jsonlint 它是JSON验证器。
12	gulp-uglify 它缩小了JavaScript文件。
13	gulp-concat 它连接CSS文件。

单元测试插件

Sr.No.	插件和说明
1	gulp-nodeunit 它运行Gulp的节点单元测试。
2	gulp-jasmine 它用于报告与输出相关的问题。
3	gulp-qunit 它为QUnit测试提供基本的控制台输出，并使用PhantomJS节点模块和PhantomJS运行器QUnit插件。
4	gulp-mocha 它指定了Mocha周围的薄包装并运行Mocha测试。
5	gulp-karma 它已在Gulp中弃用。

图形插件

Sr.No.	插件和说明
1	gulpicon 它从SVG生成精灵并将它们转换为PNG。
2	gulp-iconfont 它与Web字体一起用于从SVG创建WOFF，EOT，TTF文件。
3	gulp-imacss 它将图像文件转换为数据URI并将它们放入单个CSS文件中。
4	gulp-responsive 它为不同的设备生成响应图像
5	gulp-sharp 它用于更改和调整图像的方向和背景。
6	gulp-svgstore 它将SVG文件与元素组合成一个文件。
7	gulp-imagemin & gulp-tinypng 它用于压缩图像，如PNG，JPEG，GIF，SVG。
8	gulp-spritesmith 它用于从一组图像和CSS变量创建spritesheet。

编译器插件

Sr.No.	插件和说明
1	gulp-less 它为Gulp提供了LESS插件。
2	gulp-sass 它为Gulp提供SASS插件。
3	gulp-compass 它为Gulp提供指南针插件。
4	gulp-stylus 它用于将手写笔保存在CSS中。
5	gulp-coffee 它为Gulp提供了coffeescript插件。
6	gulp-handlebars 它为Gulp提供了把手插件。
7	gulp-jst 它在JST中提供下划线模板。
8	gulp-react 它将Facebook React JSX模板指定为JavaScript。
9	gulp-nunjucks 它在JST中指定Nunjucks模板。
10	gulp-dustjs 它在JST中指定了Dust模板。
11	gulp-angular-templatecache 它在templateCache中指定AngularJS模板。

其他插件

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

Sr.No.	插件和说明
1	gulp-grunt 它运行Gulp的Grunt任务
2	gulp-watch 它会在发生更改时监视文件。
3	gulp-notify 它会在任务失败时通知错误消息。
4	gulp-git 它允许使用Git命令。
5	gulp-jsdoc 它为Gulp创建JavaScript文档。
6	gulp-rev 它为文件名提供静态资产修订。
7	gulp-bump 它增加了JSON包中的版本。
8	gulp-bower-files 它用于注入凉亭包。
9	gulp-removelogs 它删除了console.log语句。
10	gulp-preprocess 它根据上下文或环境配置预处理HTML，JavaScript和其他文件。
11	gulp-duration 它指定Gulp任务的持续时间。
12	gulp-changed & gulp-newer 它运行修改过的文件和更新的文件。
13	gulp-connect 它用于使用LiveReload运行Web服务器。
14	gulp-shell 它运行Shell命令。
15	gulp-ssh 它使用SSH和SFTP任务进行连接。
16	gulp-zip 它压缩文件和文件夹。
17	gulp-clean＆gulp-copy
18	gulp-filesize 它以人类可读的格式指定文件大小。
19	gulp-util 它为gulp插件提供实用程序。

免责声明：以上内容版权归原作者所有，如有侵犯您的原创版权请告知，我们将尽快删除相关内容。感谢每一位辛勤著写的作者，感谢每一位的分享。