gulp工程化工具
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工程化工具的更多相关文章
- Grunt和Gulp构建工具在Visual Studio 2015中的高效的应用
Grunt和Gulp构建工具在Visual Studio 2015中的高效的应用 Grunt和Gulp是Javascript世界里的用来做自动压缩.Typescript编译.代码质量lint工具.cs ...
- gulp打包工具
首先安装全局gulp $ npm install --global gulp 下载成功后 新建一个项目或者一个文件夹(做测试) mkdir testgulp 在该文件或者项目下下载gulp工具 $ n ...
- [翻译]在gulp构建工具中使用PostCSS
前言 PostCSS已经在一段时间内迅速普及,如果你还不知道PostCSS或还没有使用它,我建议你看一下之前的一篇介绍文章<PostCSS简介>,其中介绍了使用PostCSS的基本方法,包 ...
- gulp 构建工具
1. gulp 的简介 gulp是前端开发过程中对代码进行构建的工具,是自动化项目的构建利器:她不仅能对网站资源进行优化,而且在开发过程中很多重复的任务能够使用正确的工具自动完成:使用她,我们不仅可以 ...
- 腾讯IVWEB前端工程化工具feflow思考与实践
本篇文章主要介绍腾讯IVWEB团队从0到1在工程化的思考和实践.feflow的全称是Front-end flow(前端工作流),致力于提升研发效率和规范的工程化解决方案.愿景是通过feflow,可以使 ...
- webpack打包和gulp打包工具详细教程
30分钟手把手教你学webpack实战 阅读目录 一:什么是webpack? 他有什么优点? 二:如何安装和配置 三:理解webpack加载器 四:理解less-loader加载器的使用 五:理解ba ...
- ASP.NET5之客户端开发:Grunt和Gulp构建工具在Visual Studio 2015中的高效的应用
Grunt和Gulp是Javascript世界里的用来做自动压缩.Typescript编译.代码质量lint工具.css预处理器的构建工具,它帮助开发者处理客户端开发中的一些烦操重复性的工作.Grun ...
- [转]gulp打包工具总结
与grunt类似,gulp也是构建工具,但相比于grunt的频繁IO操作,gulp的流操作能更快更便捷地完成构建工作.gulp借鉴了Unix操作系统的管道(pipe)思想,前一级的输出,直接变成后一级 ...
- Gulp自动化工具之图片压缩
一.安装node https://nodejs.org/download/ 根据需要选择对应的版本 安装好了之后可以通过node -v参看一下版本 node -v 二.安装gulp npm insta ...
随机推荐
- 浏览器兼容的JS写法总结
一.元素查找问题 1. document.all[name] (1)现有问题:Firefox不支持document.all[name] (2)解决方法:使用getElementsByName( ...
- jquery 图片转为base64
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name ...
- Windows下的Memcache安装:
Windows下的Memcache安装:1. 下载memcache的windows稳定版,解压放某个盘下面,比如在c:\memcached2. 在终端(也即cmd命令界面)下输入 'c:\memcac ...
- SQLyog键盘快捷方式
SQLyog键盘快捷方式 连接 Ctrl+M 创建新连接 Ctrl+N 以当前连接属性创建新连接 Ctrl+F4/Ctrl+W 断开当前连接 Ctrl+Tab 切换到下一个连接 Ctrl+Shift+ ...
- freemarker报错之十一
1.错误描述 六月 03, 2014 11:00:35 下午 freemarker.log.JDK14LoggerFactory$JDK14Logger error 严重: Template proc ...
- vxWorks应用程序加载的另一种办法
现在我们的工作中,应用程序一般都是和BSP联编,然后将vxworks_rom.bin烧到班子里.在BSP启动后,调用应用程序的函数的. 但是这样有个问题,就是应用程序和BSP结合的太紧密了.BSP开发 ...
- T470p VS 2017 上运行 VS 2015 + Qt 5.6.2 + GLSL 400
vs 2017 的qt设置可以按照这篇文章 注意,必须使用qt的安装程序进行安装,否则会出现意想不到的问题(不要简单地把qt的文件拷贝过来..血的教训) 显卡的问题 好不容易编译通过了,一运行报了一个 ...
- MessageFormat.format用法
用法一: package gacl.request.study; import java.io.IOException; import java.text.MessageFormat; import ...
- WPF基础篇之命名空间
WPF中XAML与C#一样,也有自己独立的编译器.XAML会被解析和编译,最终形成微软的中间语言存储在程序集中.在解析和编译XAML的语言过程中,我们经常需要告诉编译器一些重要的信息,比如XAML代码 ...
- 【BZOJ1084】最大子矩阵(动态规划)
[BZOJ1084]最大子矩阵(动态规划) 题面 题目描述 这里有一个n*m的矩阵,请你选出其中k个子矩阵,使得这个k个子矩阵分值之和最大.注意:选出的k个子矩阵不能相互重叠. 输入输出格式 输入格式 ...