前端工业化工具Gulp初体验
1. 全局安装 gulp:
npm install --global gulp
2.在项目目录下,用以下命令创建一个基本的package.json文件
npm init
3.安装Gulp
npm install --save-dev gulp
4.安装所需插件如:
npm install gulp-contrib-uglify --save-dev
5.在项目根目录下创建一个名为 gulpfile.js 的文件:
var gulp = require('gulp');
//引入插件
var uglify = require('gulp-uglify');
//默认任务:把src/test.js压缩存入build文件夹
gulp.task('default', function() {
gulp.src('src/test.js')
.pipe(uglify())
.pipe(gulp.dest('build'));
});
6.运行gulp
gulp
压缩前:

压缩后

好文推荐:
http://javascript.ruanyifeng.com/tool/gulp.html
http://segmentfault.com/a/1190000002932998
前端工业化工具Gulp初体验的更多相关文章
- 前端工业化工具Grunt初体验
今天来学学Grunt~~目的是为了自动化!自动压缩...自动修复...自动合并等... 提示:Grunt基于Node.js,安装之前要先安装Node.js 1.安装 grunt-cli npm ins ...
- 前端自动化工具gulp自动添加版本号
之前,我介绍了学习安装并配置前端自动化工具Gulp,觉得gulp确实比grunt的配置简单很多,于是我决定再深入学习一下gulp,就去网上查了资料,发现gulp还可以自动添加版本号,这个功能就为我平时 ...
- (转载)前端构建工具gulp使用
前端构建工具gulp使用 前端自动化流程工具,用来合并文件,压缩等. Gulp官网 http://gulpjs.com/ Gulp中文网 http://www.gulpjs.com.cn/ Gulp中 ...
- (转)前端构建工具gulp入门教程
前端构建工具gulp入门教程 老婆婆 1.8k 2013年12月30日 发布 推荐 10 推荐 收藏 83 收藏,20k 浏览 本文假设你之前没有用过任何任务脚本(task runner)和命令行工具 ...
- 前端构建工具gulp
前端构建工具gulp使用 前端自动化流程工具,用来合并文件,压缩等. Gulp官网 http://gulpjs.com/ Gulp中文网 http://www.gulpjs.com.cn/ Gul ...
- 学习安装并配置前端自动化工具Gulp
Gulp和所有Gulp插件都是基于nodeJs来运行的,因此在你的电脑上需要安装nodeJs,安装过程请移驾安装并配置前端自动化工具--grunt.安装完成后,通过运行cmd进入DOS命令窗口,如图: ...
- 前端构建工具gulp使用
前端自动化流程工具,用来合并文件,压缩等. Gulp官网 http://gulpjs.com/ Gulp中文网 http://www.gulpjs.com.cn/ Gulp中文文档 https://g ...
- 前端构建工具gulp介绍
2016年3月3日 10:46:08 晴 前端构建工具gulpjs的使用介绍及技巧 gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简 ...
- gulp初体验记录(简介、插件开发介绍)
目前用的业界比较知名的三个前端构建工具:grunt.gulp.fis,自己此前一直都是只在用grunt,fis看过一点,gulp则一直都没注意过,直到最近发现好像用的人越来越多,所以今天也就抽了点时间 ...
随机推荐
- [How to] UIScrollView的使用方法
1.简介 代码 延续前一个博客使用Xib来创建view,本文我们创建一个带有PageControlView的ScrollView的table的headView,如下图: 具有自动滚动: 具有拖拽完毕后 ...
- shell 中的<,<<,>,>>
相信熟悉linux的童鞋不会对这四个符合陌生,shell脚本的文件流有时候真的挺容易搞晕人的,下面我们一起了解一下吧 参考链接:http://www.cnblogs.com/chengmo/archi ...
- AC日记——[POI2008]BLO-Blockade 洛谷 [POI2008]BLO-Blockade
[POI2008]BLO-Blockade 思路: tarjan: 代码: #include <bits/stdc++.h> using namespace std; #define ma ...
- 【lua】可变长参数
lua可变长参数 在lua中可以使用...表示可变长参数,在函数内通过表访问可变参数 function rest(...) -- 把可变参数放在表类 local args = { ... } prin ...
- CentOS7单机部署lamp环境和apache虚拟主机
(1)apache介绍 apache : httpd.apache.org 软件包:httpd 端口服务:80/tcp(http) 443/tcp(https,http+ssl) 配置文件: /etc ...
- [解决] python WindowsError: [Error 3]
python 运行出错 WindowsError: [Error ] : 'D:\\\xe7\x81\xab\xe8\xbd\xa6\xe9\x87\x87\xe9\x9b\x86\xe5\x99\x ...
- Codeforces 1099 A. Snowball-暴力(Codeforces Round #530 (Div. 2))
A. Snowball time limit per test 1 second memory limit per test 256 megabytes input standard input ou ...
- 解决Linux用户模板文件被删除后显示不正常问题
缺失用户模板文件(用户骨架文件)会导致shell提示符不完整,可以到/etc/skel/目录下复制相关文件来恢复 (1).创建测试环境,删除模板文件 [root@xuexi ~]# useradd t ...
- 第1天:Ansible安装部署
Ansible介绍 Ansible是一个简单的自动化引擎,可完成配置管理.应用部署.服务编排以及各种IT需求.它是一款使用Python语言开发实现的开源软件,其依赖Jinjia2.paramiko和P ...
- Windows命令远程执行工具Winexe
Windows命令远程执行工具Winexe 在对Windows系统执行渗透测试中,通过各种方式可以获取目标主机的用户名和密码.这时,只要对方主机开启文件共享服务,就可以借助Winexe工具远程执行 ...