您现在的位置:首页 >> 前端 >> 内容

gulp初探

时间:2016/12/9 9:39:58 点击:

  核心提示:gulp简介基于流的代码自动化构建工具,减少重复工作: 预处理语言的编译。 js,css,html压缩混淆。 图片体积优化。常见用法(原生的用法)任务自定义:gulp.task(hello,()={c...

gulp简介

基于流的代码自动化构建工具,减少重复工作:

预处理语言的编译。 js,css,html压缩混淆。 图片体积优化。
常见用法(原生的用法)
任务自定义:

gulp.task('hello',()=>{
console.log('hello')
})
默认任务

// 默认执行的任务
gulp.task('default',()=>{
console.log('default')
})
src,dest,pipe
如:gulp.src('./src/**/*.*').pipe(gulp.dest('./dest')),注意:路径和文件的匹配方法。 watch函数

gulp.task('default',()=>{
console.log('default')
gulp.watch('./src/*',['dest'])
})

第三方插件

gulp本身不支持太多功能,大量的功能需要通过第三方插件来提供。
* less编译插件gulp-less

安装:npm install gulp-less --save
npm官网
* jade编译gulp-jade
* 合并文件gulp-concat
* 最小化js文件gulo-uglify
* 重命名文件gulp-rename
* 最小化css文件gulp-minify-css
* 压缩htmlgulp-minify-html
* 压缩图像gulp-imagemin
* 创建本地服务器gulp-connect
https://www.npmjs.com/package/gulp-connect

对比webpack
Webpack 中文指南 https://webpack.github.io/

Tags:GU UL LP P初 
作者:网络 来源:GISER的专栏