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"
    });

});
时间: 2024-10-03 14:42:22

gulp监听文件变化,并拷贝到指定目录的相关文章

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

如何使用NodeJs来监听文件变化

1.前言 在我们调试修改代码的时候,每修改一次代码,哪怕只是很小的修改,我们都需要手动重新build文件,然后再运行代码,看修改的效果,这样的效率特别低,对于开发者来说简直不能忍. 2.构建自动编译工具 如何使用nodeJs来监听文件变化,一旦源文件修改保存时,自动运行build过程.比如当你写CoffeeScript文件或SASS文件时,保存之后可即时生成对应的JS或CSS. 基于Node.JS的侦听文件夹改变的模块有很多. a .  fs.watch.Node.JS的文件系统也可侦听某个目录

node.js 监听文件变化并打印

1 Use node.js library "chokidar"2 Detail code: var watcher = chokidar.watch("/home/camille/Downloads", { ignored: /[\/\]./, persistent: true }); var log = console.log.bind(console); watcher .on('add', function(path) { log('File', path,

使用Node.JS监听文件夹变化

使用Node.JS监听文件夹改变有许多应用场合,比如: 构建自动编绎工具 当源文件改变时,自动运行build过程,比如当你写CoffeeScript文件或SASS CSS文件时,保存之后可即时生成对应的JS或CSS. 构建自动布署工具 通过侦听源文件夹的改变,你可以自动即时将改后的文件布署到测试服务器,加快你的开发测试速度. 这些工具其实都需要侦听文件夹的改变,基于Node.JS的侦听文件夹改变的模块有很多. fs.watch 其中Node.JS的文件系统也可侦听某个目录的改变, 如fs.wat

win7 安装oracle 10g 未生成监听文件 导致配置监听时无法保存

最近这两天一直在为安装 的oracle 配置监听无法保存 再找各种解决方案,最后自己居然自己配置出来了. 因为缺少监听文件,拷贝别人的放到自己的目录下C:\oracle\product\10.2.0\client_1\NETWORK\ADMIN   listener.ora.tnsnames.ora和 sqlnet.ora 1.修改 tnsnames.ora  中的 # tnsnames.ora Network Configuration File:  c:\oracle\product\10.

mvc 缓存 sqlCacheDependency 监听数据变化

对于MVC有Control缓存和Action缓存. 一.Control缓存 Control缓存即是把缓存应用到整个Control上,该Control下的所有Action都会被缓存起来. [OutputCache(Duration = 10)] public class HomeController : Controller { // GET: Home public ActionResult Index() { ViewBag.CurrentTime = DateTime.Now; return

Angular.JS中使用$watch监听模型变化

$watch简单使用 $watch是一个scope函数,用于监听模型变化,当你的模型部分发生变化时它会通知你. $watch(watchExpression, listener, objectEquality); 每个参数的说明如下: watchExpression:监听的对象,它可以是一个angular表达式如'name',或函数如function(){return $scope.name}. listener:当watchExpression变化时会被调用的函数或者表达式,它接收3个参数:n

Android实现后台长期监听时间变化

1.首先我们的目的是长期监听时间变化,事实上应用程序退出. 通过了解我们知道注冊ACTION_TIME_TICK广播接收器能够监听系统事件改变,可是 查看SDK发现ACTION_TIME_TICK广播事件仅仅能动态注冊: Broadcast Action: The current time has changed. Sent every minute. You can not receive this through components declared in manifests, only

Windows平台下Oracle 11g R2监听文件日志过大,造成客户端无法连接的问题处理

近期部署在生产环境的应用突然无法访问,查看应用日志发现无法获取数据库连接. SystemErr R Caused by: oracle.net.ns.NetException: The Network Adapter could not establish the connection SystemErr R at oracle.net.nt.ConnStrategy.execute(ConnStrategy.java:359) SystemErr R at oracle.net.resolve