前端工业化工具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则一直都没注意过,直到最近发现好像用的人越来越多,所以今天也就抽了点时间 ...
随机推荐
- tornado 模版继承 函数和类的调用
模版继承.函数和类的调用 目录结构 lesson5.py # -*- coding:utf-8 -*- import tornado.web import tornado.httpserver imp ...
- POJ 3308
http://poj.org/problem?id=3308 考虑答案不是乘积而是和的做法, 因为对于每一个伞兵我们要么在这行内安装大炮消灭它 要么在这列中安装大炮消灭它,所以容易看出这是一个最小边覆 ...
- jstorm系列-1:入门
一. Storm整体介绍 Storm 是一个类似Hadoop MapReduce的系统, 用户按照指定的接口实现一个任务,然后将这个任务递交给JStorm系统,Jstorm将这 ...
- linux命令(43):cal命令
cal命令可以用来显示公历(阳历)日历.公历是现在国际通用的历法,又称格列历,通称阳历.“阳历”又名“太阳历”,系以地球绕行太阳一周为一年,为西方各国所通用,故又名“西历”. 1.命令格式: cal ...
- How To Install Nginx on Ubuntu 16.04 zz
Introduction Nginx is one of the most popular web servers in the world and is responsible for hostin ...
- 说说WordPress的主查询函数-query_posts()
今天说说WordPress 的主查询函数 -query_posts(),因为我正在制作的主题里面多次用到了这个函数 . query_posts()查询函数决定了哪些文章出现在WordPress 主 循 ...
- 【转】kubernetes 中 deployment 支持哪些键值
这个比较全,可以参考 ================= https://www.addops.cn/post/kubernetes-deployment-fileds.html ========== ...
- golang实现mysql数据库备份
背景 navicat是mysql可视化工具中最棒的,但是,在处理视图的导入导出方面,它是按照视图名称的字母顺序来处理的,若视图存在依赖,在导入过程中就会报错.前面已经用python写了一个,但在使用过 ...
- Java Control Statements
Java Control Statements Java For Loop public class ForExample1 { public static void main(String[] ar ...
- firfox与about:config
¤什么是about:config¤about:config是Firefox的设置页面,Firefox提供了不少高级设置选项在这里以便让你可以更加详细地控制Firefox的运行方式.官方不推荐用户手工修 ...