gulp实例
前端生产环境的简单部署
http://ionichina.com/topic/558a1c1346cb5ff7268cee9d
var gulp = require('gulp');
// 引入gulp组件(插件)
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var watch = require('gulp-watch');
var jshint = require('gulp-jshint');
var minifyCss = require('gulp-minify-css');
var notify = require('gulp-notify');
var concat = require('gulp-concat');
var useref = require('gulp-useref');
var filter = require('gulp-filter');
var gulpif = require('gulp-if');
var clean = require('gulp-clean');
//index.html css、js合并压缩
gulp.task('index', function () {
var assets = useref.assets();
return gulp.src('app/index.html')
.pipe(assets)
.pipe(gulpif('*.js', uglify()))
.pipe(gulpif('*.css', minifyCss()))
.pipe(assets.restore())
.pipe(useref())
.pipe(gulp.dest('www'));
});
// 语法检查
gulp.task('jshint', function () {
return gulp.src('app/js/*.js')
.pipe(jshint())
.pipe(jshint.reporter('default'));
});
// 复制文件
gulp.task('copy', function () {
gulp.src('app/fonts/*')
// 目标地址
.pipe(gulp.dest('www/fonts/'))
gulp.src('app/templates/**')
// 目标地址
.pipe(gulp.dest('www/templates/'))
gulp.src('app/img/*')
// 目标地址
.pipe(gulp.dest('www/img/'))
});
// 清空图片、样式、js
gulp.task('clean', function () {
return gulp.src(['www/css/*', 'www/js/*', 'www/img/*', 'www/lib/*', 'www/templates/*'], {read: false})
.pipe(clean({force: true}));
});
// 注册缺省任务
gulp.task('default', ['jshint', 'clean', 'index', 'copy']);
gulp实例的更多相关文章
- Gulp实例(包括环境搭建的自动检测)
# Gulp实例(包括环境搭建的自动检测) Gulp是一个自动化构建工具,开发者可以使用它在项目开发过程中自动执行常见任务.下面我将完成如下的功能点并且附上源码: CSS文件打包 less文件打包 s ...
- gulp 使用介绍
gulp 使用介绍 gulp gulp 插件 gulp的配置文件gulpfile.js gulp 语法 gulp 实例 gulp的缺点 gulp gulp是基于Node.js的前端自动化构建工具,主要 ...
- gulp 相关文章
1.https://www.cnblogs.com/sxz2008/p/6370221.html 2.https://www.cnblogs.com/wujie520303/p/4964931.htm ...
- gulp源码分析
一.整体结构分析 整体结构 通过在nodejs环境对源码的打印,我们最终得到的gulp实例行如下图.那么我们gulp实例上的属性和方法是如何生成的呢? Gulp { domain: null, _ev ...
- 最近学习工作流 推荐一个activiti 的教程文档
全文地址:http://www.mossle.com/docs/activiti/ Activiti 5.15 用户手册 Table of Contents 1. 简介 协议 下载 源码 必要的软件 ...
- react-router+webpack+gulp路由实例
背景:新项目要开始了,有一种想要在新项目中使用react的冲动,应该也是一个单页面的应用,单页应用就涉及到一个路由的问题.于是最近在网上找了蛮多关于react-router的文章,也遇到了许多的坑,经 ...
- webpack与gulp的区别及实例搭建
webpack是什么,提到这个概念,很多人可能立马说出来,模块化加载器兼打包工具,可以把各种资源都作为模块来使用和处理等等. 说到前端构建工具,不可避免的会提到gulp,到底webpack和gulp有 ...
- React gulp、Browserify、Webpack实例
一.gulp var gulp = require('gulp'); var react = require('gulp-react'); gulp.task('jsx', function() { ...
- gulp入门学习实例
好久都没有更新博客了,每天繁忙的工作,下班之后都不想开设备了.前段时间有幸学习了一下gulp这款构建工具,现在和大家分享一下. 为什么使用Gulp Gulp基于Node.js的前端构建工具,通过Gul ...
随机推荐
- 【转载】Eclipse中.setting目录下文件介绍
原文:http://blog.csdn.net/huaweitman/article/details/52351394 Eclipse在新建项目的时候会自动生成一些文件.这些文件比如.project. ...
- BUG处理流程说明
一. BUG处理流程图: 流程描述: 1. 测试人员发现bug提交给开发. 2. 开发人员判断是否是bug. 3. 如果是bug,进行修改,修改完成后更改bug状态为已解决. 4. ...
- Maven pom.xml中的元素modules、parent、properties以及import(转)
前言 项目中用到了maven,而且用到的内容不像利用maven/eclipse搭建ssm(spring+spring mvc+mybatis)用的那么简单:maven的核心是pom.xml,那么我就它 ...
- Linux 查看文件 cat与 more 用法
1.cat 显示文件连接文件内容的工具: cat 是一个文本文件查看和连接工具.查看一个文件的内容,用cat比较简单,就是cat 后面直接接文件名. 比如: [root@localhost ~]# c ...
- SpringBoot自定义序列化的使用方式--WebMvcConfigurationSupport
场景及需求: 项目接入了SpringBoot开发,现在需求是服务端接口返回的字段如果为空,那么自动转为空字符串. 例如: [ { "id": 1, ...
- 集群扩容的常规解决:一致性hash算法
写这篇博客是因为之前面试的一个问题:如果memcached集群需要增加机器或者减少机器,那么其他机器上的数据怎么办? 最后了解到使用一致性hash算法可以解决,下面一起来学习下吧. 声明与致谢: 本文 ...
- linux命令分享一:压缩命令
Linux操作系统中,*.zip.*.tar.*.tar.gz.*.tar.bz2.*.tar.xz.*.jar.*.7z等格式的压缩与解压 zip格式 压缩: zip -r [目标文件名].zip ...
- [nginx]盗链和防盗链场景模拟实现
盗链环境模拟 http://www.daolian.com/index.html 这个页面盗用http://www.maotai.com/qq.jpg这个站点页面的图. <!doctype ht ...
- [na]tcp&udp扫描原理(nmap常用10条命令)
nmap软件使用思路及常见用法 Nmap高级用法与典型场景 namp -sn 4种包 使用nmap -sn 查询网段中关注主机或者整个网段的IP存活状态 nmap -sn nmap针对局域网和广域网( ...
- Android 录音获取分贝值的办法
参考:http://blog.csdn.net/greatpresident/article/details/38402147 public class MediaRecorderDemo { pri ...