gulpfile.js

var gulp = require('gulp');
var rename = require('gulp-rename')
var pump = require('pump');
var connect = require('gulp-connect');
//ftl转html
gulp.task('ftl-html',function(cb){
pump([
gulp.src('WEB-INF/page/Wechat/*.ftl'),
rename({extname:'.html'}),
gulp.dest('./html/Wechat')
])
})
//html转ftl
gulp.task('html-ftl',function(cb){
pump([
gulp.src('./html/Wechat'),
rename({extname:'.ftl'}),
gulp.dest('WEB-INF/page/Wechat')
])
}) // webserver livereload web服务器
gulp.task('webserver', function() {
connect.server({
root:'./',
port:9000,
livereload:true
});
}); gulp.task('html', function () {
gulp.src('**/**/*.html')
.pipe(connect.reload());
});
gulp.task('watch',function(){
gulp.watch(['./*html'],['html'])
}) gulp.task('default',['webserver','watch'])

package.json

{
"name": "webapp",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"gulp": "^3.9.1",
"gulp-connect": "^5.0.0",
"gulp-rename": "^1.2.2",
"pump": "^1.0.2"
}
}

参考文章http://www.gulpjs.com.cn/docs/api/

gulp工程化工具的更多相关文章

  1. Grunt和Gulp构建工具在Visual Studio 2015中的高效的应用

    Grunt和Gulp构建工具在Visual Studio 2015中的高效的应用 Grunt和Gulp是Javascript世界里的用来做自动压缩.Typescript编译.代码质量lint工具.cs ...

  2. gulp打包工具

    首先安装全局gulp $ npm install --global gulp 下载成功后 新建一个项目或者一个文件夹(做测试) mkdir testgulp 在该文件或者项目下下载gulp工具 $ n ...

  3. [翻译]在gulp构建工具中使用PostCSS

    前言 PostCSS已经在一段时间内迅速普及,如果你还不知道PostCSS或还没有使用它,我建议你看一下之前的一篇介绍文章<PostCSS简介>,其中介绍了使用PostCSS的基本方法,包 ...

  4. gulp 构建工具

    1. gulp 的简介 gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以 ...

  5. 腾讯IVWEB前端工程化工具feflow思考与实践

    本篇文章主要介绍腾讯IVWEB团队从0到1在工程化的思考和实践.feflow的全称是Front-end flow(前端工作流),致力于提升研发效率和规范的工程化解决方案.愿景是通过feflow,可以使 ...

  6. webpack打包和gulp打包工具详细教程

    30分钟手把手教你学webpack实战 阅读目录 一:什么是webpack? 他有什么优点? 二:如何安装和配置 三:理解webpack加载器 四:理解less-loader加载器的使用 五:理解ba ...

  7. ASP.NET5之客户端开发:Grunt和Gulp构建工具在Visual Studio 2015中的高效的应用

    Grunt和Gulp是Javascript世界里的用来做自动压缩.Typescript编译.代码质量lint工具.css预处理器的构建工具,它帮助开发者处理客户端开发中的一些烦操重复性的工作.Grun ...

  8. [转]gulp打包工具总结

    与grunt类似,gulp也是构建工具,但相比于grunt的频繁IO操作,gulp的流操作能更快更便捷地完成构建工作.gulp借鉴了Unix操作系统的管道(pipe)思想,前一级的输出,直接变成后一级 ...

  9. Gulp自动化工具之图片压缩

    一.安装node https://nodejs.org/download/ 根据需要选择对应的版本 安装好了之后可以通过node -v参看一下版本 node -v 二.安装gulp npm insta ...

随机推荐

  1. Centos中hive/hbase/hadoop/mysql实际操作及问题总结

    目录 Hive中文乱码问题 hive和hbase的版本不一致 Ambari hive插入Hbase出错 Hive0.12和Hbase0.96不兼容,重新编译hive0.12.0 hiveserver不 ...

  2. js获取文本的行数

    <div class="txt" style="line-height:30px">我是文字<br>我是文字<br>我是文字 ...

  3. python替换脚本

    任何场合都用的到的全文替换 #!/usr/bin/python import sys if len(sys.argv) < 5: print 'usage: python %s from to ...

  4. Linux 系统裁剪笔记1

    1.什么裁剪? 本篇文章的主要目的是让笔者和读者更深的认识Linux系统的运作方式,大致内容就是把Linux拆开自己一个个组件来组装,然后完成一个微型的Linux系统.下面,让我们来实现吧..写的不好 ...

  5. but the supplied types were (flex.messaging.io.amf.ASObject) and converted to (null)."

    1.错误描述 [RPC Fault faultString="Cannot invoke method  'saveOrUpdate'. " faultCode="Ser ...

  6. Struts2(七) Struts2访问Servlet的API

    当接受表单参数,向页面保持数据时.要用到Struts访问Servlet 的API .下面只做参考,有错误或不同意见可以发送邮箱2440867831@qq.com  .建议大家看struts文档,源代码 ...

  7. INT_MAX (2147483647) 和INT_MIN (-2147483648)溢出

    c语言中32位int型数据在运算的时候可能会出现溢出的情况,如: -2147483648-1会得到什么结果? -2147483648乘(-1)会得到什么结果? 2147483647+1会得到什么结果? ...

  8. ORA-01940: cannot drop a user that is currently connected解决方法

    我们在删除数据库用户时候会碰到如下错误 SQL> DROP USER sys_xj cascade; DROP USER sys_xj cascade*ERROR at line 1:ORA-0 ...

  9. Css3关键帧动画

    @keyframes设置动画规则,可以理解为一个剧本: 1.name动画的名字必需填写 2.可以使用百分比0%-100%或者from...to...必填内容: 3.需要变化css的样式:必需: ani ...

  10. AC自动机模板3【洛谷3796】

    AC自动机的第三个模板 其实,个人觉得,目前我写的这三个不同的模板完全是可以合并在一起求解的. 只是,在这两个无关联的OJ上,同一个AC自动机都可以完成的问题被拆成了三道题而已. 因此,代码只需要略加 ...