gulp安装教程
1、安装nodejs并选装cnpm;
npm install cnpm -g --registry=https://registry.npm.taobao.org
2、全局安装gulp;
cnpm install gulp -g
3、新建package.json文件;(第二次在项目中使用gulp时可跳过1、2步)
进入项目文件夹,cnpm init
4、本地安装gulp;
cnpm install gulp --save-dev
5、安装gulp插件;
cnpm install ### --save-dev (###为插件名)
6、新建gulpfile.js文件;
var gulp = require('gulp'),
htmlmin = require('gulp-htmlmin');
gulp.task('CompressHtml', 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
};
return gulp.src('index.html')//需压缩的HTML文件
.pipe(htmlmin(options))
.pipe(gulp.dest('dist/html'));//'dist'为存放文件夹
});
7、通过命令提示符运行gulp任务。
gulp 任务名称
gulp CompressHtml
gulp安装教程的更多相关文章
- windows下Gulp入门详细教程 &&gulp安装失败的原因(红色)
以下教程亲自实践可行: 另外添加一个Gulp自动编译.压缩.更新.测试的教程链接:https://markpop.github.io/2014/09/17/Gulp%E5%85%A5%E9%97%A8 ...
- Gulp安装使用教程
题记:为什么要使用gulp,网上有很多关于gulp的优势,而在我看来,这些都是工具的优势!工具的优势最主要体现在易用性上,听说gulp比grunt更易用,所以这里写个文档记录. 同样要保证nodejs ...
- (转)前端构建工具gulp入门教程
前端构建工具gulp入门教程 老婆婆 1.8k 2013年12月30日 发布 推荐 10 推荐 收藏 83 收藏,20k 浏览 本文假设你之前没有用过任何任务脚本(task runner)和命令行工具 ...
- Gulp安装流程、使用方法及cmd常用命令导览
Gulp安装流程.使用方法及CMD常用命令导览 来自前端小白的gulp及周边知识学习总结 一.名词介绍: Npm--node包管理工具 一开始我不理解,包管理工具是什么鬼.后来用到的gulp也好,gu ...
- gulp ( http://markpop.github.io/2014/09/17/Gulp入门教程 )
前言 最近流行前端构建工具,苦于之前使用Grunt,代码很难阅读,现在出了Gulp,真是摆脱了痛苦.发现了一篇很好的Gulp英文教程,整理翻译给大家看看. 为什么使用Gulp Gulp基于Node.j ...
- Linux+apache+mono+asp.net安装教程
Linux+apache+mono+asp.net安装教程(CentOS上测试的) 一.准备工作: 1.安装linux系统(CentOS,这个就不多讲了) 2.下载所需软件 http-2.4.4.ta ...
- Greenplum 源码安装教程 —— 以 CentOS 平台为例
Greenplum 源码安装教程 作者:Arthur_Qin 禾众 Greenplum 主体以及orca ( 新一代优化器 ) 的代码以可以从 Github 上下载.如果不打算查看代码,想下载编译好的 ...
- git 安装教程
昆,简单说下安装教程1,安装Git2,安装TortoiseGit3,打开第一步安装的git工具GIT BASH
- Docker和Docker-compose安装教程以及docker-elk,docker-storm安装教程
此安装教程仅供我自己安装配置时查看,其他的人不可以偷看!!! 安装Docker 1. Update package information, ensure that APT works with th ...
随机推荐
- Android Server Push - MQTT推送实现tokudu
转自:http://www.juapk.com/thread-2834-1-1.html 项目说明:采用MQTT协议实现Android推送消息传输协议:IBM的MQTT协议 JAR包地址:下载服务器安 ...
- S5PV210使用的启动方式
2017年12月25日1. S5PV210存储配置: +内置64KB NorFlash(上电不需要初始化)(叫IROM 内部外存):用于存储预先设置的BL0; + SoC内置96KB SRAM(上电不 ...
- django book表单验证学习
django提供了强大的表单验证功能form 个人认为是把html代码封装到form里面,就像封装models中的数据一样.而且带有强大的验证功能,不需要后台再去写一堆乱七八糟的验证 具体操作查看dj ...
- Android SQLiteDatabase中query、insert、update、delete方法参数说明
1.SQLiteDataBase对象的query()接口: public Cursor query (String table, String[] columns, String selection, ...
- 倍福TwinCAT(贝福Beckhoff)基础教程4.2 TwinCAT如何读写CSV文件
本程序只是在官方范例程序上稍作修改,在官方原有的范例中,演示了多种模式的读写(可以认为CSV文件是比TXT文件需要更多数据量的时候使用,比如记录一个小型的数据库集合) 但是写的比较混乱,甚至没有H ...
- C4:原型模式 Prototype
用原型实例指定创建对象的种类,并且拷贝这些原型创建新的对象.应用场景: A.用new创建对象通常有较为复杂的数据准备或权限准备B.对象较大,拷贝对象可以节省内存 UML图: class WorkExp ...
- d3系列2--api攻坚战05
今天的内容相比之前的就有点儿难了?怂了没? 别问我为什么不讲详细内容,你写十遍自己就清楚究竟是怎么回事了,画画的事儿还是得动笔动键盘. 先看看效果图 事实上假设用笨办法一条一条画的话.也不难. 可是设 ...
- 关于汉诺塔,C++代码,代码效果演算
1.故事介绍 汉诺塔:汉诺塔(又称河内塔)问题是源于印度一个古老传说的益智玩具.大梵天创造世界的时候做了三根金刚石柱子,在一根柱子上从下往上依照大小顺序摞着64片黄金圆盘.大梵天命令婆罗门把圆盘 ...
- (八)Thymeleaf的 th:* 属性之—— 模板布局& th:with& 属性优先级
3.7 模板布局 模板名称:layout.html 3.7.1 th:fragment e.g.模板名为footer.html页面body部分如下: <body> <div th:f ...
- 属性字符串NSMutableAttributedString
要实现如下效果: NSString * mailString = @"mymail@126.com"; NSString * mailStringWithQuotes = [NSS ...