gulp监听文件变化,并拷贝到指定目录
- 暂时不支持目录修改、创建、删除
var gulp = require('gulp');- var fs = require('fs');
- var path = require('path');
- var less = require('gulp-less');
- var sass = require('gulp-sass');
- var minifycss = require('gulp-minify-css');
- var concat = require('gulp-concat');
- var uglify = require('gulp-uglify');
- var rename = require('gulp-rename');
- var del = require('del');
- var tinylr = require('tiny-lr');
- var server = tinylr();
- var port = 1234;
- // browser-sync
- var browserSync = require('browser-sync');
- // 创建多层目录
- function mkdirs(dirname, mode, callback){
- fs.exists(dirname, function (exists){
- if(exists){
- callback();
- }else{
- //console.log(path.dirname(dirname));
- mkdirs(path.dirname(dirname), mode, function (){
- fs.mkdir(dirname, mode, callback);
- });
- }
- });
- }
- // 拷贝文件
- function copyfile(oldPath, newPath) {
- console.log('复制'+oldPath+' -> '+newPath);
- var stat = fs.lstatSync(oldPath);
- if(stat.isDirectory()) {
- console.log(oldPath+'是目录');
- return false;
- }
- var readStream = fs.createReadStream(oldPath);
- var writeStream = fs.createWriteStream(newPath);
- readStream.pipe(writeStream);
- readStream.on('end', function () {
- console.log('copy end');
- });
- readStream.on('error', function () {
- console.log('copy error');
- });
- }
- gulp.task('default', function() {
- });
- gulp.task('css', function() {
- return gulp.src('src/*.css') //压缩的文件
- .pipe(gulp.dest('target/css')) //输出文件夹
- .pipe(minifycss()); //执行压缩
- });
- // 编译Sass
- gulp.task('sass', function() {
- gulp.src('./src/css/*.scss')
- .pipe(sass())
- .pipe(rename({ suffix: '.min' }))
- .pipe(minifycss())
- .pipe(gulp.dest('target/css'));
- });
- gulp.task('js', function() {
- return gulp.src('./src/js/*.js')
- .pipe(gulp.dest('target/js')) //输出main.js到文件夹
- .pipe(rename({suffix: '.min'})) //rename压缩后的文件名
- .pipe(uglify()) //压缩
- .pipe(gulp.dest('target/js')); //输出
- });
- gulp.task('html', function() {
- return gulp.src('./src/*.php')
- .pipe(gulp.dest('target/')); //输出
- });
- // 监听任务 运行语句 gulp watch
- gulp.task('watch',function(){
- server.listen(port, function(err){
- if (err) {
- return console.log(err);
- }
- //拷贝修改过的文件
- gulp.watch('src/**/**', function(e) {
- console.log(e);
- var oldPath = e.path;
- var newPath = oldPath.replace('\\src\\', '\\target\\');
- var newDirPathTemp = newPath.split("\\");
- var currentPath = fs.realpathSync('.');
- var newDirPath = [];
- for(var i = 0; i < newDirPathTemp.length-1; i++) {
- newDirPath[i] = newDirPathTemp[i];
- }
- newDirPath = newDirPath.join("\\");
- newDirPath = newDirPath.replace(currentPath, '');
- newDirPath = newDirPath.replace(/\\/g, "/");
- newDirPath = newDirPath.replace("/", "./");
- //console.log('当前路径'+newDirPath);
- // 修改或增加时
- if('added' == e.type || 'changed' == e.type || 'renamed' == e.type) {
- // 判断目录是否存在,不存在则创建
- fs.exists(newDirPath, function(exists){
- if(exists){
- //console.log("文件夹存在");
- copyfile(oldPath, newPath);
- } else {
- //console.log("文件夹不存在,则创建目录");
- mkdirs(newDirPath);
- // 延时,等待目录创建完成
- setTimeout(function(){
- copyfile(oldPath, newPath);
- }, 200);
- }
- });
- } else if('deleted' == e.type) { //删除
- fs.unlink(newPath, function(err){
- console.log('删除'+newPath+err);
- });
- }
- });
- // 监听sass
- gulp.watch('src/css/*.scss', function(){
- gulp.run('sass');
- });
- // 监听js
- gulp.watch('./src/js/*.js', function(){
- gulp.run('js');
- });
- // 监听html
- gulp.watch('./src/*.php', function(){
- gulp.run('html');
- });
- });
- // 实时同步到浏览器
- browserSync.init(['target/css/*', 'target/js/*', 'target/*.html', 'target/*.php'], {
- /* 静态服务
- server: {
- baseDir: "target"
- }
- */
- // 代理模式
- proxy: "dz.com"
- });
- });
gulp监听文件变化,并拷贝到指定目录的更多相关文章
- gulp监听文件变化,并拷贝到指定目录(转)---参考记录
###暂时不支持目录修改.创建.删除.var gulp = require('gulp'); var fs = require('fs'); var path = require('path'); v ...
- 如何使用NodeJs来监听文件变化
1.前言 在我们调试修改代码的时候,每修改一次代码,哪怕只是很小的修改,我们都需要手动重新build文件,然后再运行代码,看修改的效果,这样的效率特别低,对于开发者来说简直不能忍. 2.构建自动编译工 ...
- node.js监听文件变化
前言 随着前端技术的飞速发展,前端开发也从原始的刀耕火种,向着工程化效率化的方向发展.在各种开发框架之外,打包编译等技术也是层出不穷,开发体验也是越来越好.例如HMR,让我们的更新可以即时可见,告别了 ...
- 利用WatchService监听文件变化
在实现配置中心的多种方案中,有基于JDK7+的WatchService方法,其在单机应用中还是挺有实践的意义的. 代码如下: package com.longge.mytest; import jav ...
- shell遍历文件目录,监听文件变化,拼接字符串
最近利用业余时间学习了shell 并做了个例子 实现的功能是 : 监听demo文件夹下的文件,只要新增了 .js的文件就把对应的文件名重组,拼接, 最后写入到demo.js里面. 文件结构如下 : ...
- gulp之sass 监听文件,自动编译
gulpfile.js文件如下: var gulp = require('gulp'); var sass = require('gulp-sass'); gulp.task('default', f ...
- 玩转gulp之watch监听文件自动编译
博客移至 https://www.dodoblog.cn/blog?id=5befc928e0feb34495b57035 我们在写页面的时候,用到sass less等css预处理器的时候,虽然写的很 ...
- Java NIO.2 使用Path接口来监听文件、文件夹变化
Java7对NIO进行了大的改进,新增了许多功能: 对文件系统的访问提供了全面的支持 提供了基于异步Channel的IO 这些新增的IO功能简称为 NIO.2,依然在java.nio包下. 早期的Ja ...
- 【转载】java 监听文件或者文件夹变化的几种方式
1.log4j的实现的文件内容变化监听 package com.jp.filemonitor; import org.apache.log4j.helpers.FileWatchdog; public ...
随机推荐
- FPGA作为从机与STM32进行SPI协议通信---Verilog实现 [转]
一.SPI协议简要介绍 SPI,是英语Serial Peripheral Interface的缩写,顾名思义就是串行外围设备接口.SPI,是一种高速的,全双工,同步的通信总线,并且在芯片的管脚上只占用 ...
- Bitmap 的几种压缩方式
微信的缩略图要求是不大于32k,这就需要对我的图片进行压缩.试了几种方法,一一道来. 代码如下 ByteArrayOutputStream baos = new ByteArrayOutputSt ...
- Ajax实现原理
Ajax的工作 Ajax直觉认识:我们发送一个请求,但是这个请求比较特殊它是异步的,也就是说客户端是不会感觉到的.在发送这个请求的时候我们绑定了一个事件,这个事件会监控我们发送请求的状态,并且每次状态 ...
- Tomcat容器虚拟路径设置
1.[官方文档]在tomcat\conf下server.xml中找到 <Host name="localhost" appBase="webapps" u ...
- android开发中的问题集锦(慢慢搬运...)
1, android 设置ExpandableListView 系统默认箭头到右边 if(android.os.Build.VERSION.SDK_INT < android.os.Build. ...
- Trie树-字典查找
描述 小Hi和小Ho是一对好朋友,出生在信息化社会的他们对编程产生了莫大的兴趣,他们约定好互相帮助,在编程的学习道路上一同前进. 这一天,他们遇到了一本词典,于是小Hi就向小Ho提出了那个经典的问题: ...
- [转] 从 C 到 Objective C 入门1
转自: http://blog.liuhongwei.cn/iphone/objective-c/ 进军iPhone开发,最大的难点之一就是怪异的Objective C语法了.不过,了解之后才发现,原 ...
- ArrayList和Vector的区别
3.ArrayList和Vector的区别 答: 这两个类都实现了List接口(List接口继承了Collection接口),他们都是有序集合,即存储在这两个集合中的元素的位置都是有顺序的,相当于一种 ...
- js⑤
##返回在制定位置的的字符 var result = str.charAt(1); console.log(result); console.log(str[1]); ##返回在指定的位置的字符 ...
- Java 社区论坛 - Sym 1.6.0 发布
简介 Sym 是一个用 Java 写的现代化的社区论坛,欢迎来体验!(如果你需要搭建一个企业内网论坛,请使用 SymX) 非常详细的 Sym 功能点脑图 Sym 的诞生是有如下几点原因: (正版) 好 ...