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. Day5模块-shutil模块

    参考博客:http://www.cnblogs.com/wupeiqi/articles/4963027.html shutil模块是高级的文件.文件夹.压缩处理的模块.比如文件的copy.压缩等. ...

  2. 用Node.JS+MongoDB搭建个人博客(万众期待的router.js)(四)

    万众期待的router.js,是我现在最想写的一个博客.因为他包含了整个个人博客的精髓.在这里,所有的请求配置,返回的参数等等所做的业务逻辑都在这个文件里实现. 我会详细说明这些代码的作用,所以这篇博 ...

  3. 2_Add Two Numbers --LeetCode

    原题如下: 思路:在一个while中遍历两个链表,直到最长的链表为空,或者没有进位.每一步获取两个链表对应的结点的值a,b,然后相加a+b.如果上一步又进位,那就加a+b+1,若由于进位加1后还产生进 ...

  4. python语言中的AOP利器:装饰器

    一.前言 面向切面编程(AOP)是一种编程思想,与OOP并不矛盾,只是它们的关注点相同.面向对象的目的在于抽象和管理,而面向切面的目的在于解耦和复用. 举两个大家都接触过的AOP的例子: 1)java ...

  5. eclipse报错

    1.eclipse报错具体如下 Error occurred during the build. Errors running builder 'JavaScript Validator' on pr ...

  6. 错误代码: 1052 Column 'stu_id' in field list is ambiguous

    1.错误描述 1 queries executed, 0 success, 1 errors, 0 warnings 查询:select stu_id, (SELECT stu_name FROM t ...

  7. 申请Jetbrain教育帐号,免费使用一年

    JetBrains是一家捷克的软件开发公司.旗下IDE产品有(不限于):(1) IntelliJ,IDEA  Java集成开发工具:(2) PHPStorm,PHP 集成开发工具:(3) PyChar ...

  8. 解决Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.1:compile (default-compile) on project autotest_fchtgl: Compilation failure的方法

    在碰到maven install 发现报错 Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.2:comp ...

  9. 学习Javascript闭包(Closure)及几个经典面试题理解

    今天遇到一个面试题,结果让我百思不得其解.后来在查阅了各种文档后,理清了来龙去脉.让我们先来看看这道题: function Foo( ){ var i = 0; return function( ){ ...

  10. .Net Remoting使用总结

    刚开始接触Remoting的时候,有点排斥,我都使用过webservice,wcf.以及rest.想一想,Remoting是不是过时了?由于公司前辈的缘故,公司的产品用的就是Remoting,那时候w ...