gulpfile.js备份
var gulp = require('gulp');
var uglify = require('gulp-uglify');
// var rename = require('gulp-rename');
// var imagemin = require("gulp-imagemin");
// var pngquant = require('imagemin-pngquant');
// //确保本地已安装gulp-cache [cnpm install gulp-cache --save-dev]
// var cache = require('gulp-cache');
var less = require('gulp-less');
var htmlmin = require('gulp-htmlmin');
var minicss = require('gulp-minify-css');
var autoprefixer = require('gulp-autoprefixer');
gulp.task('less', function() {
gulp.src('css/*.less')
.pipe(less())
.pipe(autoprefixer({
browsers: ['last 2 versions', 'Android >= 4.0'],
cascade: true, //是否美化属性值 默认:true 像这样:
//-webkit-transform: rotate(45deg);
// transform: rotate(45deg);
remove:true //是否去掉不必要的前缀 默认:true
}))
.pipe(minicss())
.pipe(gulp.dest('dist/css'));
})
gulp.task('img',function(){
gulp.src('img/*{png,svg,ico,jpg,gif}')
.pipe(gulp.dist('dist/img'))
})
gulp.task('html', function() {
var options = {
removeComments: true, //清除HTML注释
collapseWhitespace: true, //压缩HTML
collapseBooleanAttributes: true, //省略布尔属性的值 <input checked="true"/> ==> <input />
removeEmptyAttributes: true, //删除所有空格作属性值 <input id="" /> ==> <input />
removeScriptTypeAttributes: true, //删除<script>的type="text/javascript"
removeStyleLinkTypeAttributes: true, //删除<style>和<link>的type="text/css"
minifyJS: true, //压缩页面JS
minifyCSS: true //压缩页面CSS
};
gulp.src('*.html')
.pipe(htmlmin(options))
.pipe(gulp.dest('dist'));
})
gulp.task('js', function() {
gulp.src('js/*.js')
.pipe(uglify())
.pipe(gulp.dest('dist/js'));
})
gulp.task('auto', function() {
gulp.watch('*.html', ['html']);
gulp.watch('js/*.js', ['js']);
gulp.watch('css/*.less', ['less']);
gulp.watch('img/*.{svg,mpng,jpg,gif,ico}',['img']);
})
gulp.task('default', ['auto']);
css: less编译css ,自动添加前缀,压缩。 html : 压缩 。 js:压缩
gulpfile.js备份的更多相关文章
- 通过Anuglar Material串串学客户端开发 - javascript编译和gulpfile.js
Angular Material不仅仅有本身框架的源代码,还有在这个框架上实现的一个应用docs.更为强大的是,这个应用是真正的产品网站:就是它的官网.我有理由相信,这个网站是从源代码直接发布的,从网 ...
- gulp的使用(二)之gulpfile.js文件的配置
Gulpfile.js是什么文件: gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她, ...
- gulpfile.js不断更新中...
Gulp压缩合并js/css文件,压缩图片,以及热更新教程 var gulp = require('gulp');var concat = require('gulp-concat');//- 多个文 ...
- gulp-load-task 解决 gulpfile.js 过大的问题
当我们在项目中使用gulp来实现前端自动化时,常常因任务太多导致gulpfile.js越来越臃肿,增加后期维护/变更成本.在计算机科学领域中,分治可以将我们的项目变得井然有序.所以,我们利用这个理念, ...
- gulpfile.js文档
gulp watch 实现监听不仅需要package.json文档,还需要gulpfile.js文档.否则无法实现. 1.gulp的安装 1.1 首先必须先安装node.js.这个可以参考之前的博客& ...
- gulp 图片、样式、js、实时刷新等压缩gulpfile.js文件各个模块
1.压缩tinypng图片 gulp-tinypng-nokey,但不压缩gif格式(另外一个gulp-imagemin压缩率不高,可以压缩gif格式) // 获取 gulp var gulp = ...
- 编写gulpfile.js文件:压缩合并css、js
使用gulp一共有四个步骤: 1. 全局安装 gulp: $ npm install --global gulp 2. 作为项目的开发依赖(devDependencies)安装: $ npm inst ...
- node入门(二)——gulpfile.js初探
本文关于gulpfile.js怎么写,利于完成个性化需求.本文开发环境默认已安装node,详情参考<node入门(一)——安装>. 一.安装gulp npm install -g gulp ...
- Gulpfile.js——编译、压缩、合并js和css文件
gulp 一个入门教程:http://www.ydcss.com/gulp API文档地址:http://www.gulpjs.com.cn/docs/api/ 我的一个Low版的gulpfile v ...
随机推荐
- 01_2_模拟spring装载bean
01_2_模拟spring装载bean 1. xml配置文件内容 beans.xml <beans> <bean id="u" class="com.w ...
- NOIP模拟赛 czy的后宫5
描述 czy要召集他的妹子,但是由于条件有限,可能每个妹子不能都去,但每个妹子都有一个美丽值,czy希望来的妹子们的美丽值总和最大(虽然……). czy有一个周密的电话通知网络,它其实就是一棵树,根结 ...
- 【最大权闭合子图 tarjan】bzoj1565: [NOI2009]植物大战僵尸
dinic+tarjan板子练手题 Description Plants vs. Zombies(PVZ)是最近十分风靡的一款小游戏.Plants(植物)和Zombies(僵尸)是游戏的主角,其 中P ...
- 【思维题 单调栈】loj#2430. 「POI2014」沙拉餐厅 Salad Bar
t老师的做法好神…… 题目描述 桌面上有 n 个水果,分别是苹果和橘子.Bytea需要从水果中选择连续的一个区间,并从左到右或从右到左拿水果,且过程中橘子的数量必须始终不小于苹果的数量.求最长的区间大 ...
- 基于Inception搭建MySQL SQL审核平台Yearing
基于Inception搭建MySQL SQL审核平台Yearing Inception 1. Inceptionj简介 2. Inception安装 2.1 下载和编译 2.2 启动配置 Yearni ...
- sphinx关键字套红
sphinx定义搜索结果,搜索的内容着重显示,可以使用下面代码 <?php /** * Created by PhpStorm. * User: pc00001 * Date: 2015/4/1 ...
- SSH框架面试总结----1
1:struts2的工作流程 1)客户端浏览器发出HTTP请求. 2)根据web.xml配置,HTTP请求会被FilterDispatcher接收. 3)根据struts.xml,找到对应的Actio ...
- 如何用纯 CSS 创作一组昂首阔步的圆点
效果预览 在线演示 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览. https://codepen.io/comehope/pen/ejrMKe 可交互视频 ...
- destoon手机端mobileurl函数增加城市分类参数
mobileurl函数在include/global.func.php 858行 共四个参数,moduleid-模型id,catid-分类id,itemid -文章id,page-页码 functio ...
- 1.python中的变量
什么是变量 1.在任何语言中都有变量的概念,在python中变量是用一个变量名表示,变量名必须是用大小写英文字母,数字,下滑写(_)组成.不能用数字开头.(但用中文做变量名也可以,不要这样做) 例: ...