coffescript测试源码
 
gulp = require('gulp')
#删除 1、清空目录 常用插件 gulp-clean 、del (nodejs模块)
del = require('del')
#2、文件复制 原生模块gulp,插件:gulp-cpoy
#3、JS压缩 插件:gulp-uglify
uglify = require('gulp-uglify')
#4、CSS压缩 插件:gulp-minify-css,gulp-uncss
minifycss = require('gulp-minify-css')
#去掉无用的css
uncss = require('gulp-uncss')
#5、html压缩
minifyhtml = require('gulp-minify-html')
#6、文件合并 插件:gulp-minify-css,gulp-uncss
concat = require('gulp-concat')
#7、浏览器刷新
browserSync = require('browser-sync').create()
#8 监视 插件:gulp-watch 原生模块:gulp
gulp.task('default', ['clean','miniCSS','miniJS','miniHTML'], ->
)
#9、其他 yargs gulp-notify通知 gulp-util
# run-sequence异步同步执行任务[],[]中括号内为异步,两个括号件为同步
gulp.task('clean', (callback)->
#这种写法比较清晰
# del(['./dest/*.html','./dest/js/.js','./dest/css/**/*.css'], callback)
#比较简洁的写法,类似正则
del('./dest/**/.{html,js.css}', callback)
#注意点:不能使用/dest/css/**这种写法,经过多次测试,这才文件拷贝的时候会发生以下两种错误
# Error: ENOENT: no such file or directory
# Error: EEXIST: file already exists, mkdir
return
)
gulp.task('miniCSS', ->
gulp.src('src/**/*.css')
.pipe(minifycss())
.pipe(gulp.dest('dest/css/'))
return
)
gulp.task('miniJS', ->
gulp.src('src/js/*.js')
.pipe(uglify())
.pipe(gulp.dest('dest/js/'))
)
gulp.task('miniHTML',->
gulp.src('src/*.html')
.pipe(minifyhtml())
.pipe(gulp.dest('dest/'))
)
#gulp.task('server',['clean'], ->
# browserSync.init({
# baseDir: 'dest/',
# },
# port: 5000
# )
# gulp.watch(['./src/**/*.js','./src/**/*.css'],['watch'])
# return
#)
#gulp.task('watch', ['miniCSS','miniJS','copyhtml'],->
# browserSync.reload();
# return
#)

gulp系列:简单实践的更多相关文章

  1. 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gulp专家

    系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...

  2. 前端构建大法 Gulp 系列 (二):为什么选择gulp

    系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...

  3. gulp-notify处理报错----gulp系列(二)

    上一节,以less为例,入门了gulp,并为任务结构做了抽离. 前端们,gulp该用起来了,简单的demo入门——gulp系列(一) 本节学习下gulp-notify,官方这样解释的: gulp-no ...

  4. kafka原理和实践(二)spring-kafka简单实践

    系列目录 kafka原理和实践(一)原理:10分钟入门 kafka原理和实践(二)spring-kafka简单实践 kafka原理和实践(三)spring-kafka生产者源码 kafka原理和实践( ...

  5. VueRouter爬坑第一篇-简单实践

    VueRouter系列的文章示例编写时,项目是使用vue-cli脚手架搭建. 项目搭建的步骤和项目目录专门写了一篇文章:点击这里进行传送 后续VueRouter系列的文章的示例编写均基于该项目环境. ...

  6. 前端构建大法 Gulp 系列 (四):gulp实战

    前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gulp专家 前 ...

  7. 前端构建大法 Gulp 系列 (一):为什么需要前端构建

    系列目录 前端构建大法 Gulp 系列 (一):为什么需要前端构建 前端构建大法 Gulp 系列 (二):为什么选择gulp 前端构建大法 Gulp 系列 (三):gulp的4个API 让你成为gul ...

  8. Thrift简单实践

    0.什么是RPC RPC(Remote Procedure Call - 远程过程调用),是通过网络从远程计算机上请求服务,而不需要了解底层网路技术的细节.简单点说,就是像调用本地服务(方法)一样调用 ...

  9. Java 异步处理简单实践

    Java 异步处理简单实践 http://www.cnblogs.com/fangfan/p/4047932.html 同步与异步 通常同步意味着一个任务的某个处理过程会对多个线程在用串行化处理,而异 ...

  10. Gulp.js - 简单、直观的自动化项目构建工具

    Gulp.js 是一个简单.直观的构建系统.崇尚代码优于配置,使复杂的任务更好管理.通过结合 NodeJS 的数据流的能力,你能够快速构建.通过简单的 API 接口,只需几步就能搭建起自己的自动化项目 ...

随机推荐

  1. 第 29 章 CSS3 弹性伸缩布局[中]

    学习要点: 1.混合过度版 主讲教师:李炎恢 本章主要探讨 HTML5 中 CSS3 提供的用来实现未来响应式弹性伸缩布局方案,这里做一个初步的了解. 一.混合过渡版 混合版本的 Flexbox 模型 ...

  2. Scalaz(24)- 泛函数据结构: Tree-数据游览及维护

    上节我们讨论了Zipper-串形不可变集合(immutable sequential collection)游标,在串形集合中左右游走及元素维护操作.这篇我们谈谈Tree.在电子商务应用中对于xml, ...

  3. PHP storm快捷键

    左边文件路径看不到了,按alt+1就出来了 ctrl+j 插入活动代码提示 ctrl+alt+t 当前位置插入环绕代码 alt+insert 生成代码菜单 ctrl+q 查看代码注释 ctrl+d 复 ...

  4. RDBMS架构的开源DW/DSS引擎列表

    因为笔者早期以oracle为主要RDBMS进行设计和优化,所以几乎即使单表超过5000w,多张超过300万以上的表做任意复杂的统计和风控计算都没出过性能问题.如今全面mysql为主线或者说open s ...

  5. SequenceInputStream

    SequenceInputStream从名字上看, 他是一个序列字节输入流 既然是个序列 那么意味着 SequenceInputStream装着许多的输入流 所以 可以用他来合并文件 Sequence ...

  6. 记一次CSR上线及总结

    终于到上线的时候了,可以好好休息了.放松了,但在没有经过用户确认之前,一切皆有可能发生...... 经历: 项目终于完成,上线文档已准备就绪,等待上线时刻. 在上线之前,忘记了解目前环境的部署架构,注 ...

  7. 使用<link> 标签定义浏览器标题栏小图标

    使用link标签的rel属性,设置成icon.同时设置href属性值为小图标图片的url. <link rel=" icon " href="image/icon. ...

  8. Vue-router中文教程-Vue-router参考手册.CHM

    下载地址http://download.csdn.net/detail/shouce_ren/9689243 百度云下载地址

  9. sass高级语法

    github地址:https://github.com/lily1010/sass/tree/master/course03 用到的sass语法是: sass --watch test.scss:te ...

  10. SharePoint Online 创建门户网站系列之定制栏目

    前 言 SharePoint Online自带的库就带有二级页面和详细页面,也就是Allitems页面和DispForm页面,但是实在不够美观,尤其对于门户网站这一企业门面来说,更是无法接受. 下面, ...