gulp-concat
用来合并文件的,可以将多个文件进行合并,比如js、css等
使用方法可参看
https://www.npmjs.com/package/gulp-concat
gulp-uglify
用来压缩js文件的工具
相关配置如下
https://github.com/terinjokes/gulp-uglify
gulp-sourcemaps
用来将对应管道中的文件生成.map文件,而.map文件的作用就是让浏览器在对应加载的代码上找到映射的源,比如通过加载的css找到对应的sass
关于.map可以参看
http://www.cnblogs.com/vajoy/p/3992411.html
gulp-autoprefixer
代码兼容性自动补全
https://github.com/postcss/autoprefixer
对于CSS3的代码而言,各家浏览器需要编写的代码不一样,所以还需要各自的编写,webstorm已经提供这一功能,但是并不是所有的都可以自动补全,所以这里面用到了这个,来帮助我们将CSS代码自动补全兼容的代码内容。
比如:
:fullscreen a {
display: flex
}
补全后就是
:-webkit-full-screen a {
display: -webkit-box;
display: -webkit-flex;
display: flex
}
:-moz-full-screen a {
display: flex
}
:-ms-fullscreen a {
display: -ms-flexbox;
display: flex
}
:fullscreen a {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex
}
gulp-sass
这个不用多说了,看名字就知道,编译sass的,但是这里提出一嘴就是,下载这个不知道为啥总下载失败,然后墙外下载就没问题,墙内的话可能只能下载一半,运行时候才有问题。
browser-sync
用来启动一个web服务,是的可以通过HTTP的方式来调试web页面,也可以在里面进行配置访问代理,总的来讲就是一个通过node编写的web服务
http://www.browsersync.cn/docs/options/
分享到:
相关推荐
精通 gulp 常用插件
gulp-plugin-cb 使用 Gulp 插件转换 Vinyl 文件,但带有回调接口。 例子 var transform = require ( 'gulp-plugin-cb' ) ; var uglify = require ( 'gulp-uglify' ) ; transform ( file , uglify ( ) , function ...
gulp-plugin-boilerplate Boilerplate开始创建插件 包含所有当前的最佳实践。 入门 在您的目录中,运行: $ curl -fsSL https://github.com/sindresorhus/gulp-plugin-boilerplate/archive/main.tar.gz | tar -xz ...
首先我们了解一下什么是gulp, gulp是前端自动化构建工具,在开发过程中很多重复的任务,我们都可以正确的使用gulp来完成,gulp基于nodejs,使用gulp可以做很多事情
gulp配置 gulp配置
gulp编译文件、gulp编译项目
发电机口香糖插件样板 安装 $ npm install --global yo generator-gulp-plugin-boilerplate 用法 用运行它: $ yo gulp-plugin-boilerplate 执照 麻省理工学院:copyright:
#GULPPLUGINNAME 用 gulp 编译一些东西信息包裹吞咽插件名称描述描述节点版本>= 0.9 吞咽版4.x用法安装$ npm install --save-dev GULPPLUGINNAME例子 // include the required packages.var gulp = require ( 'gulp'...
gulp-pangu 是 Gulp 扩展,可以在中文与英文之间添加空格字符。 var pangu = require('gulp-pangu');安装$ npm install --save-dev gulp-pangu使用// include the required packages.var gulp = ...
一、什么是gulp,为什么要使用它 1.1自动化 - gulp是一个工具包,可帮助您在开发工作流程中自动执行痛苦或耗时的任务。 1.2与平台无关 - 集成内置于所有主要IDE中,人们正在使用gulp与PHP,.NET,Node.js,Java和...
功能支援 Gulp 4.0,自动载入本地 recipe,支援透过 npm 安装 plugin,支援嵌套任务并且允许子任务继承组态配置,支援向前、向后参照任务,透过组态配置即可处理串流:譬如 merge, queue, 或者 concat,透过组态配置...
5、gulp-babel------------------------解析es6 6、run-sequence------------------------按顺序同步执行Gulp 任务 7、gulp-rev------------------------添加文件版本号 8、gulp-rev-collector------------------...
gulp入门
gulp-ember-htmlbars 编译embar应用程序的htmlbars和handlebars 用法 安装gulp-ember-htmlbars作为开发依赖项: npm install --save-dev gulp-ember-htmlbars 执照 (麻省理工学院执照) 版权所有(c)2015 Matt ...
gulp教程,详细教你gulp的使用方法 gulp是在webpack之前非常流行的前端自动化打包工具 今天一步一步教你怎么使用gulp来编写前端自动化脚本
这是我 2019年4月调试好的最新前端node.js+Express(默认ejs)热更新架构环境,可以用于ES6学习或开发WEB应用测试。用的的NPM各模块插件版本除了Gulp是3.9.0之外,其它都是最新版的,目录如下: "babel-core": "^...
GULP使用手册,研究动力学仿真的美好工具
gulp.js 是一种基于流的,代码优于配置的新一代构建工具。 Gulp 和 Grunt 类似。但相比于 Grunt 的频繁的 IO 操作,Gulp 的流操作,能更快地完成构建。 易于使用 通过代码优于配置的策略,Gulp让简单的任务简单,...
Gulp, Gulp构建前端自动化工作流(Gulp入门介绍)
定义指令三、gulp常用插件四、gulp常用项目流程操作及部分插件使用方法 一、gulp简介 gulp 是一个基于node的自动化打包构建工具,前端开发者可以使用它来处理常见任务: 搭建web服务器; 文件保存时自动重载浏览器...