gulp配置文件备份
/**
* Created by leyi on 2016/8/25 0025.
*/ /*********************package.json依赖模块************************/
/*
dependencies": {
"gulp": "*",
"gulp-autoprefixer": "*",
"postcss-value-parser": "*",
"normalize-range": "*",
"num2fraction": "*",
"browserslist": "*",
"caniuse-db": "*",
"postcss": "*",
"gulp-minify-css": "*",
"gulp-concat": "*",
"gulp-htmlmin": "*",
"gulp-imagemin": "*",
"imagemin-pngquant": "*",
"gulp-order":"*",
"gulp-rename": "*",
"gulp-sass": "*",
"gulp-uglify":"*",
"gulp-changed": "*"
}
*/
var gulp=require('gulp');//gulp模块
//css3前缀自动补全模块,依赖postcss-value-parser,normalize-range,num2fraction,browserslist,caniuse-db,postcss模块
var autoprefixer = require('gulp-autoprefixer');
var cssmin = require('gulp-minify-css');//css压缩模块
var concat = require('gulp-concat');//合并文件模块
var htmlmin = require('gulp-htmlmin');//html压缩模块
var imagemin = require('gulp-imagemin');//图片压缩模块
var pngquant = require('imagemin-pngquant');//图片深度压缩模块,是imagemin插件的一个扩展插件
var order = require('gulp-order');//先后排序
var rename = require('gulp-rename');//文件重命名模块
var sass = require('gulp-sass');//sass模块
var uglify = require('gulp-uglify');//js压缩模块
var changed=require('gulp-changed');//只操作有过修改的文件模块 /*********************设置各种输入输出文件夹的位置************************/ /*合并JS输入输出路径配置*/
var srcConcatjs = 'src/js/*.js';
var dstConcatjs = 'dist/js'; /*压缩JS输入输出路径配置*/
var srcJsmin = 'src/js/*.js';
var dstJsmin = 'dist/js'; /*压缩CSS输入输出路径配置*/
var srcCssmin = 'src/css/*.css';
var dstCssmin = 'dist/css'; /*css3前缀自动补全输出路径配置*/
var srcAutoprefix = 'src/css/*.css';
var dstAutoprefix = 'dist/css'; /*SASS编译输入输出路径配置*/
var srcSass = 'src/css/*.sass';
var dstSass = 'dist/css'; /*压缩图片输入输出路径配置*/
var srcImage = 'src/images/**/*.{png,jpg,gif,ico}';
var dstImage = 'dist/images'; /*压缩html输入输出路径配置*/
var srcHtml = 'src/*.html';
var dstHtml = 'dist'; /*********************具体任务************************/ //js合并任务
gulp.task('concatjs', function () {
gulp.src(srcConcatjs)
.pipe(order([]))//设置文件合并顺序
.pipe(concat('all.js'))//合并并重命名
.pipe(gulp.dest(dstConcatjs));
}); //js压缩任务
gulp.task('jsmin', function () {
gulp.src([srcJsmin])// 指明源文件路径、并进行文件匹配
.pipe(rename({ suffix: '.min' })) // 重命名
.pipe(uglify({
mangle: false,//类型:Boolean 默认:true 是否修改变量名
compress: true,//类型:Boolean 默认:true 是否完全压缩
preserveComments: 'all' //保留所有注释
}))
.pipe(gulp.dest(dstJsmin));
}); //css压缩任务
gulp.task('cssmin', function () {
gulp.src(srcCssmin)
.pipe(cssmin({
advanced: false,//类型:Boolean 默认:true [是否开启高级优化(合并选择器等)]
compatibility: '!',//保留ie7及以下兼容写法 类型:String 默认:''or'*' [启用兼容模式; 'ie7':IE7兼容模式,'ie8':IE8兼容模式,'*':IE9+兼容模式]
keepBreaks: false//类型:Boolean 默认:false [是否保留换行]
}))
.pipe(gulp.dest(dstCssmin));
}); //css3前缀自动补全任务
gulp.task('autoprefix', function () {
gulp.src(srcAutoprefix)
.pipe(autoprefixer({
browsers: [ "chrome 30",'ie >=8', "Firefox < 20","ios_saf 8", "safari 8",'Android >= 2.3'],
cascade: true, //是否美化属性值 默认:true 像这样:
//-webkit-transform: rotate(45deg);
// transform: rotate(45deg);
remove:true //是否去掉不必要的前缀 默认:true
}))
.pipe(gulp.dest(dstAutoprefix));
});
// [ "chrome 30", "Firefox < 20","ios_saf 8", "safari 8",'Android >= 2.3','ie 6-8','Opera <= 20']
// [ "chrome 30", "Firefox < 20","ios_saf 8", "safari 8",'Android >= 2.3'] //sass任务
gulp.task('sass', function() {
gulp.src(srcSass)
.pipe(sass({
outputStyle: 'compressed'
}))
.pipe(gulp.dest(dstSass));
}); //图片压缩任务
gulp.task('imagemin', function () {
return gulp.src(srcImage)
.pipe(changed(dstImage)) // 对比文件是否有过改动(此处填写的路径和输出路径保持一致)
.pipe(imagemin({
optimizationLevel: 3, //类型:Number 默认:3 取值范围:0-7(优化等级)
progressive: true, //类型:Boolean 默认:false 无损压缩jpg图片
interlaced: true, //类型:Boolean 默认:false 隔行扫描gif进行渲染
multipass: true, //类型:Boolean 默认:false 多次优化svg直到完全优化
use: [pngquant()] //使用pngquant插件进行深度压缩
}))
.pipe(gulp.dest(dstImage));
}); //html压缩任务
gulp.task('htmlmin', function () {
var options = {
removeComments: false,//清除HTML注释
collapseWhitespace: false,//压缩HTML
collapseBooleanAttributes: true,//省略布尔属性的值 <input checked="true"/> ==> <input />
removeEmptyAttributes: false,//删除所有空格作属性值 <input id="" /> ==> <input />
removeScriptTypeAttributes: true,//删除<script>的type="text/javascript"
removeStyleLinkTypeAttributes: true,//删除<style>和<link>的type="text/css"
minifyJS: true,//压缩页面JS
minifyCSS: true//压缩页面CSS
};
gulp.src(srcHtml)
.pipe(htmlmin(options))
.pipe(gulp.dest(dstHtml));
}); /*
//gulp默认任务模板
gulp.task('default',['']); //watch任务模板
gulp.task('watch',function(){
gulp.watch('', ['']);
gulp.watch('',function(event){
//变化类型 added为新增,deleted为删除,changed为改变
console.log(event.type);
//变化的文件的路径
console.log(event.path);
})
})
*/
详细使用说明-http://www.cnblogs.com/2050/p/4198792.html
gulp配置文件备份的更多相关文章
- javaweb常用工具类及配置文件备份
Javaweb常用工具类及配置文件备份 做一个代码备份,以后常用到的. hibernate工具类备份 package com.dly.service; /* * hibernate获取sessi ...
- gulp配置
/* gulp配置 */ /* gulp配置 */ var gulp = require('gulp'), concat = require('gulp-concat'), rename = requ ...
- Scss开发临时学习过程||webpack、npm、gulp配置
SCSS语法: 假设变量申明带有!default,那么如果在此申明之前没有这个变量的申明,则用这个值,反之如果之前有申明,则用申明的值. ‘...’传递多个参数: @mixin box-shadow( ...
- gulp 配置前端项目打包
项目发布时,需要对项目js文件进行压缩,混淆,连接等操作以减小项目http请求,加快访问. gulpjs.com中有很多插件可以用来配置打包部署. 需要用的常用插件有: gulp-jsmin 压缩j ...
- gulp 配置自动化前端开发
有的人说,grunt已经廉颇老矣,尚能饭否.gulp已经成为了未来的趋势,或许将撼动grunt的地位. 那么就得看看gulp到底优势在哪里,在我最近的使用中发现,我的到了一个结论:“grunt廉颇老矣 ...
- gulp配置版本号 教程之gulp-rev-append
简介: 使用gulp-rev-append给页面的引用添加版本号,清除页面引用缓存. 1.安装nodejs/全局安装gulp/项目安装gulp/创建package.json和gulpfile.js文件 ...
- Express+Less+Gulp配置高效率开发环境
版权声明:本文由金朝麟原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/627049001486519548 来源:腾云阁 h ...
- 流行得前端构建工具比较,以及gulp配置
前端现在三足鼎立的构建工具(不算比较老的ant,yeoman),非fis,grunt,gulp莫属了. fis用起来最简单,我打算自己得项目中使用一下fis. 先说一下gulp安装吧. 第一步:安装n ...
- win上gulp配置
主线: 安装nodejs -> 全局安装gulp -> 项目安装gulp以及gulp插件 -> 配置gulpfile.js -> 运行任务 1,安装node.js 1.1.说明 ...
随机推荐
- docker存储结构解析
由于aufs并未并入内核,故而目前只有Ubuntu系统上能够使用aufs作为docker的存储引擎,而其他系统上使用lvm thin provisioning(overlayfs是一个和aufs类似的 ...
- 使用nvm安装node
安装nvm curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh | bash 安装node nvm ...
- 常用Java排序算法
常用Java排序算法 冒泡排序 .选择排序.快速排序 package com.javaee.corejava; public class DataSort { public DataSort() { ...
- Oracle补习班第三天
In every triumph, there's a lot of try. 每个胜利背后都有许多尝试 Oracle管理实例组件 主要组件分为两部分例程,与数据库: 例程分为两部分SGA跟进程: S ...
- maven详解之生命周期与插件
Maven是一个优秀的项目管理工具,它能够帮你管理编译.报告.文档等. Maven的生命周期: maven的生命周期是抽象的,它本身并不做任何的工作.实际的工作都交由"插件"来完成 ...
- Linux shell相关
1 一些常见的问题及解决方法 <1> ssh登录不显示用户名跟路径 可能原因: ssh登录的用户没有配置shell 对应解决方案:在/etc/passwd文件对应用户那一行末尾添加/bin ...
- JavaScript学习基础篇【第1篇】: JavaScript 入门
JavaScript 快速入门 JavaScript代码可以直接嵌在网页的任何地方,不过通常我们都把JavaScript代码放到<head>中,由<script>...< ...
- 查看SQLServer最耗资源时间的SQL语句
执行最慢的SQL语句 SELECT (total_elapsed_time / execution_count)/1000 N'平均时间ms' ,total_elapsed_time/1000 N'总 ...
- msChart组件安装与编程
首先下载mschart.ocx文件,至于它所依赖的.net环境,网上有很多,本人下载的插件给出链接,http://www.cr173.com/soft/47300.html而它所依赖的环境可以从我的云 ...
- 转@ManyToMany- annotation关系映射篇(下)
原文:http://blog.sina.com.cn/s/blog_6fef491d0100obdd.html 终于要说ManyToMany了 场景:Product和Customer. 先看TestP ...