gulp外挂 uglify 的使用
1.js文件压缩
第一步:安装外挂 : 
第二步:gulpfile.js 配置 : (首先看你的package.json 中有没有添加依赖,如果有
这一句,代表添加成功啦。)
输入以下代码 :
var gulp = require('gulp'),
uglify = require("gulp-uglify"); // 将需要的文件 require 进来
gulp.task('minify-js', function () { // minify-js是你要执行的操作的名字。 随便定义,但是最好可读性和可辨识性强
gulp.src('src/js/*.js') // 要压缩的js文件 这里有一个小坑。就是路径要全,如果只输入js/*.js 可以执行,但是没效果
.pipe(uglify()) //使用uglify进行压缩
.pipe(gulp.dest('dist/js')); //压缩后的路径 没有的话会自动创建
});
第三步: 随便拿一个js 文件,放到js文件夹下面,然后就可以执行下一步 压缩 啦
第四步: cmd 根目录中输入 gulp minfy-js 回车。 就会看到这个
编译完成。真的很简单。
2.css文件压缩 /html 文件压缩
操作完全一样。 外挂分别是 css: gulp-minify-css html: gulp-minify-html
gulp外挂 uglify 的使用的更多相关文章
- gulp 外挂 rename 的使用
安装和使用就不详细说了.前面有. gulpfile.js 的配置 var gulp = require('gulp'), rename = require('gulp-rename'), // 记得先 ...
- gulp 压缩 uglify报错GulpUglifyError: unable to minify JavaScript
引:https://www.cnblogs.com/vellemo/p/6898125.html 在压缩的时候报错:GulpUglifyError: unable to minify JavaScri ...
- [转]gulp构建前端工程
摘要: Gulp 是一个自动化工具,前端开发者可以使用它来处理常见任务: 搭建web服务器 文件保存时自动重载浏览器 使用预处理器如Sass.LESS 优化资源,比如压缩CSS.JavaScript. ...
- using gulp
原 荐 gulp构建前端工程 半张一块 发布时间: 2016/07/27 16:22 阅读: 895 收藏: 4 点赞: 4 评论: 2 摘要 Gulp 是一个自动化工具,前端开发者可以使用它来处理常 ...
- Gulp使用指南
Grunt靠边,全新的建构工具来了.Gulp的code-over-configuration不只让撰写任务(tasks)更加容易,也更好阅读及维护. Glup使用node.js串流(streams)让 ...
- 转:Gulp使用指南
原文来自于:http://www.techug.com/gulp Grunt靠边,全新的建构工具来了.Gulp的code-over-configuration不只让撰写任务(tasks)更加容易,也更 ...
- gulp-uglify 与gulp.watch()配合使用时遇到的重复压缩问题
今天学习gulp时候,用到gulp-uglify压缩js模块,遇到的一个问题-当用gulp.watch来监听js文件的变动时出现重复压缩的问题 目录结构如下: gulpfile.js代码如下: var ...
- (转)gulp使用
前端构建工具gulpjs的使用介绍及技巧 gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简单,学习起来很容易,而且gulpjs使用的是nod ...
- 前端构建工具的用法—grunt、gulp、browserify、webpack
随着前端项目的飞速发展,项目越来越大.文件越来越多,前端工程化的工具也越来越多.下面介绍目前最流行的四种构建工具——grunt.gulp.browserify.webpack 所有的构建工具都是基于N ...
随机推荐
- eclipse调试solr
eclipse调试solr 现在solr的源码包,我这里是4.10.2, 编译, ant ivy-bootstrap ant eclipse 导入elipse,将solr/example/solr/下 ...
- Eclipse,到了说再见的时候了——Android Studio最全解析
转自:http://blog.jobbole.com/77635/ 去年的Google大会上,Google带给我们一个小玩具——Android Studio,说它是玩具,是因为它确实比较菜,界面过时, ...
- NOI 题库 7084
7084 迷宫问题 描述 定义一个二维数组: int maze[5][5] = { 0, 1, 0, 0, 0, 0, 1, 0, 1, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, ...
- ZeroMQ接口函数之 :zmq_plain - 明文认证
ZeroMQ 官方地址 :http://api.zeromq.org/4-2:zmq_plain zmq_plain(7) ØMQ Manual - ØMQ/4.1.0 Name zmq_plain ...
- 非递归创建二叉树( C++队列 )
非递归按照 层序 创建二叉树,利用 队列(即可先进先出特点)存放已访问的结点元素的地址. 初始化:front=rear= -1: 每储存一个结点元素 rear+1 ,利用 rear%2==0 来使 f ...
- ApplicationContext更强的功能-学习笔记
---恢复内容开始--- 一.国际化支持 二.资源访问 三.事件传递 国际化支持 ApplicationContext继承了org.springframework.context.MessageRes ...
- Android-adb指令
adb概念: adb的全称为Android Debug Bridge(调试桥):通过adb我们可以在Eclipse中方便通过DDMS来调试Android程序.当我们运行Eclipse时ADB进程 ...
- Android四大组件之actiivity
1.Acitivity Activity是Android一个非常重要的用户接口(四大组件之一),是可见的,主要是用户和应用程序之间进行交互的接口.在每个Activity中都可以放很多控件,所以也可以把 ...
- WM_COPYDATA进程间通信方案
连续在两个公司使用WM_COPYDATA实现进程间通信了,整理一下 具体步骤: 一. 进程A通过ShellExecute启动进程B, 将用于通信的窗口句柄hWndA(已强转为int值)通过命令行参 ...
- EntityFramework Reverse POCO Code First 生成器
功能强大的(免费)实体框架工具 Julie Lerman 实体框架是开源的,因此开发社区可以在 entityframework.codeplex.com 上共享代码. 但是不要将自己局限在那里寻找工具 ...