Javascript 用gulp检测文件更改

我有一个大口文件：

  var gulp = require('gulp'),
      concat = require('gulp-concat'),
      uglify = require('gulp-uglify');

  gulp.task('minifyJS', function() {
    return gulp.src(['src/*.js'])
      .pipe(uglify())
      .pipe(gulp.dest('min'));
  });

  gulp.task('watch', function() {
    gulp.watch(['src/*.js'], ['minifyJS']);
  });

我想知道是什么文件触发了观察者和他的绝对路径

例如：如果我的项目放在/myCode中，并且我更改了文件src/main.js，我希望看到/myCode/src/main.js内部minifyJS任务。有办法吗

---

感谢您抽出时间。

使用

吞咽更改的

npm软件包

$ npm install --save-dev gulp-changed

试试下面的gulp文件（我还没试过）

---

请参阅此软件包的文档

您可以使用

gulp ng annotate

和

gulp changed

来执行此操作：

var gulp = require('gulp');
var changed = require('gulp-changed');
var rename = require('gulp-rename');
var ngAnnotate = require('gulp-ng-annotate'); // just as an example
var SRC = 'src/*.js';
var DEST = 'src/';

//Function to get the path from the file name
function createPath(file) {
    var stringArray = file.split('/');
    var path = '';
    var name = stringArray[1].split('.');
    stringArray = name[0].split(/(?=[A-Z])/);
    if (stringArray.length>1) {stringArray.pop()};
    return {folder: stringArray[0], name: name[0]}
}


gulp.task('default', function () {
    return gulp.src(SRC)
        .pipe(changed(DEST))
        // ngAnnotate will only get the files that
        // changed since the last time it was run
        .pipe(ngAnnotate())
        .pipe(rename(function (path) {
            var createdPath = createPath(path);
            path.dirname = createdPath.folder;
            path.basename: createdPath.name,
            path.prefix: "",
            path.suffix: "",
            path.extname: ".min.js"
         }))
        .pipe(gulp.dest(DEST));
});

结果:

---

根据您对朱利安答案的评论，这应该非常接近您想要的，或者至少让您朝着正确的方向前进：

var gulp = require('gulp'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify'),
    cache = require('gulp-cached'),
    rename = require('gulp-rename'),
    path = require('path');

function fileName(file) {
  return file.dirname + path.sep + file.basename + file.extname;
}

gulp.task('minifyJS', function() {
  return gulp.src(['src/*.js'])
    .pipe(cache('minifyJS'))
    .pipe(rename(function(file) {
      var nameOfChangedFile = fileName(file);
      if (nameOfChangedFile == './main.js') {
        file.basename = 'main.min'
      }
      if (nameOfChangedFile == './userView.js') {
        file.basename = 'user/userView.min'
      }
      console.log(nameOfChangedFile + ' -> ' + fileName(file));
    }))
    .pipe(uglify())
    .pipe(gulp.dest('min'));
});

gulp.task('watch', function() {
  gulp.watch(['src/*.js'], ['minifyJS']);
});

这将使用

gulp cached

来保留

src/

文件夹中通过流的所有文件的内存缓存。只有自上次调用minifyJS以来已更改的文件才会传递到

gulp rename

插件

然后使用

gulp rename

插件本身来更改更改文件的目标路径

---

注意：缓存在第一次运行时是空的，因为还没有文件通过

gulpcached

插件。这意味着第一次更改文件时，

src/

中的所有文件都将写入目标文件夹。在随后的更改中，仅写入更改的文件

我知道如何使用这个插件，但这不是我想要的。我想存储在一个变量中。这是因为我需要根据要缩小的文件更改文件的命运。谢谢你的回答谢谢你的回答，但那不是我想要的。我需要改变的命运缩小文件取决于什么文件已经改变。例如：如果我更改src/main.js，我将把缩小的文件放在min/main.min.js中，但是如果我改变src/userView.js，我想把它放在min/user/userView.min.js你的意思是：

src/main.js

src/main/main.js

和

src/userView.js

min/user/userView.min.js

？我刚刚更新了代码-它现在使用一个通用函数来创建正确的路径。让我知道它是否适合你的需要。干杯。这里的问题是，在重命名函数路径中，有一个对象的dirname键的值为“”。我需要一种将./main，js转换为src/main.jsOk的方法，忘记这一点，复制代码片段时出错。现在它工作得很好，非常感谢你的帮助！！！就像你说的，你把我带向正确的方向。我现在得到了文件名，但没有根目录；因为我需要两者，我会继续寻找答案。非常感谢您，如果“根”是指更改文件的绝对路径，请不要这样做。你不应该依赖于你的gulpfile中的绝对路径。如果你把项目搬来搬去怎么办？如果其他人尝试在不同的位置构建项目，会怎么样？在这些情况下，您的任务将不起作用。（如果您确实必须这样做，您可以使用将项目位置预先添加到

更改文件的名称

。这样做的风险由您自己承担。）我现在确实必须知道绝对路径。我有计划在将来改变它，但现在没有其他选择。

var gulp = require('gulp'),
    concat = require('gulp-concat'),
    uglify = require('gulp-uglify'),
    cache = require('gulp-cached'),
    rename = require('gulp-rename'),
    path = require('path');

function fileName(file) {
  return file.dirname + path.sep + file.basename + file.extname;
}

gulp.task('minifyJS', function() {
  return gulp.src(['src/*.js'])
    .pipe(cache('minifyJS'))
    .pipe(rename(function(file) {
      var nameOfChangedFile = fileName(file);
      if (nameOfChangedFile == './main.js') {
        file.basename = 'main.min'
      }
      if (nameOfChangedFile == './userView.js') {
        file.basename = 'user/userView.min'
      }
      console.log(nameOfChangedFile + ' -> ' + fileName(file));
    }))
    .pipe(uglify())
    .pipe(gulp.dest('min'));
});

gulp.task('watch', function() {
  gulp.watch(['src/*.js'], ['minifyJS']);
});