새 파일이나 삭제 된 파일에 대해 gulp.watch가 트리거되지 않습니까?
glob 일치에서 파일을 편집 할 때 다음 Gulpjs 작업이 제대로 작동합니다.
// watch task.
gulp.task('watch', ['build'], function () {
gulp.watch(src + '/js/**/*.js', ['scripts']);
gulp.watch(src + '/img//**/*.{jpg,jpeg,png,gif}', ['copy:images']);
gulp.watch(src + '/less/*.less', ['styles']);
gulp.watch(src + '/templates/**/*.{swig,json}', ['html']);
});
// build task.
gulp.task('build', ['clean'], function() {
return gulp.start('copy', 'scripts', 'less', 'htmlmin');
});
그러나 새 파일이나 삭제 된 파일에는 작동하지 않습니다 (트리거되지 않음). 내가 놓친 것이 있습니까?
편집 : grunt-watch 플러그인을 사용해도 작동하지 않는 것 같습니다.
gulp.task('scripts', function() {
return streamqueue(
{ objectMode: true },
gulp.src([
vendor + '/jquery/dist/jquery.min.js',
vendor + '/bootstrap/dist/js/bootstrap.min.js'
]),
gulp.src([
src + '/js/**/*.js'
]).pipe(plugins.uglify())
)
.pipe(plugins.concat(pkg.name + '.min.js'))
.pipe(gulp.dest(dest + '/js/'));
});
gulp.task('watch', ['build'], function () {
plugins.watch({glob: src + '/js/**/*.js'}, function () {
gulp.start('scripts');
});
});
편집 : 해결 되었습니다 . 이 문제 였습니다. 로 시작하는 글로브 ./
(의 가치 src
)가 ATM에서 작동하지 않는 것 같습니다.
편집 : 분명히 gulp.watch
새 파일이나 삭제 된 파일로 작업합니다. 질문을 받았을 때는 그렇지 않았다.
나머지 대답은 여전히 유효합니다. gulp-watch
보통 수정 된 파일에 대해서만 특정 작업을 수행 할 수 있고 gulp.watch
완전한 작업 만 실행할 수 있기 때문에 일반적으로 더 나은 솔루션 입니다. 합리적인 규모의 프로젝트의 경우이 기능이 너무 느려져 유용하지 않습니다.
빠진 것이 없습니다. gulp.watch
새 파일 또는 삭제 된 파일에는 작동하지 않습니다. 간단한 프로젝트를 위해 설계된 간단한 솔루션입니다.
새 파일을 찾을 수있는 파일보기를 얻으려면 훨씬 강력한 플러그인을 사용 하십시오gulp-watch
. 사용법은 다음과 같습니다.
var watch = require('gulp-watch');
// in a task
watch({glob: <<glob or array of globs>> })
.pipe( << add per-file tasks here>> );
// if you'd rather rerun the whole task, you can do this:
watch({glob: <<glob or array of globs>>}, function() {
gulp.start( <<task name>> );
});
개인적으로 첫 번째 옵션을 권장합니다. 이를 통해 파일 단위 프로세스가 훨씬 빨라집니다. 파일을 연결하지 않는 한 livereload로 개발하는 동안 훌륭하게 작동합니다.
You can wrap up your streams either using my lazypipe
library, or simply using a function and stream-combiner
like this:
var combine = require('stream-combiner');
function scriptsPipeline() {
return combine(coffeeescript(), uglify(), gulp.dest('/path/to/dest'));
}
watch({glob: 'src/scripts/**/*.js' })
.pipe(scriptsPipeline());
UPDATE October 15, 2014
As pointed out by @pkyeck below, apparently the 1.0 release of gulp-watch
changed the format slightly, so the above examples should now be:
var watch = require('gulp-watch');
// in a task
watch(<<glob or array of globs>>)
.pipe( << add per-file tasks here>> );
// if you'd rather rerun the whole task, you can do this:
watch(<<glob or array of globs>>, function() {
gulp.start( <<task name>> );
});
and
var combine = require('stream-combiner');
function scriptsPipeline() {
return combine(coffeeescript(), uglify(), gulp.dest('/path/to/dest'));
}
watch('src/scripts/**/*.js')
.pipe(scriptsPipeline());
Both gulp.watch()
and require('gulp-watch')()
will trigger for new/deleted files however not if you use absolute directories. In my tests I did not use "./"
for relative directories BTW.
Both won't trigger if whole directories are deleted though.
var watch = require('gulp-watch');
//Wont work for new files until gaze is fixed if using absolute dirs. It won't trigger if whole directories are deleted though.
//gulp.watch(config.localDeploy.path + '/reports/**/*', function (event) {
//gulp.watch('src/app1/reports/**/*', function (event) {
// console.log('*************************** Event received in gulp.watch');
// console.log(event);
// gulp.start('localDeployApp');
});
//Won't work for new files until gaze is fixed if using absolute dirs. It won't trigger if whole directories are deleted though. See https://github.com/floatdrop/gulp-watch/issues/104
//watch(config.localDeploy.path + '/reports/**/*', function() {
watch('src/krfs-app/reports/**/*', function(event) {
console.log("watch triggered");
console.log(event);
gulp.start('localDeployApp');
//});
If src
is an absolute path (starting with /
), your code is not going to detect new or deleted files. However there's still a way:
Instead of:
gulp.watch(src + '/js/**/*.js', ['scripts']);
write:
gulp.watch('js/**/*.js', {cwd: src}, ['scripts']);
and it will work!
Globs must have a separate base directory specified and that base location must not be specified in the glob itself.
If you have lib/*.js
, it'll look under the current working dir which is process.cwd()
Gulp uses Gaze to watch files and in the Gulp API doc we see that we can pass Gaze specific options to the watch function: gulp.watch(glob[, opts], tasks)
Now in the Gaze doc we can find that the current working dir (glob base dir) is the cwd
option.
Which leads us to alexk's answer: gulp.watch('js/**/*.js', {cwd: src}, ['scripts']);
I know this is an older question, but I thought I'd throw the solution I came up with. None of the gulp plugins I found would notify me of new or renamed files. So I ended up wrapping monocle in a convenience function.
Here's an example of how that function is used:
watch({
root: config.src.root,
match: [{
when: 'js/**',
then: gulpStart('js')
}, {
when: '+(scss|css)/**',
then: gulpStart('css')
}, {
when: '+(fonts|img)/**',
then: gulpStart('assets')
}, {
when: '*.+(html|ejs)',
then: gulpStart('html')
}]
});
I should note that gulpStart is also a convenience function I made.
And here is the actual watch module.
module.exports = function (options) {
var path = require('path'),
monocle = require('monocle'),
minimatch = require('minimatch');
var fullRoot = path.resolve(options.root);
function onFileChange (e) {
var relativePath = path.relative(fullRoot, e.fullPath);
options.match.some(function (match) {
var isMatch = minimatch(relativePath, match.when);
isMatch && match.then();
return isMatch;
});
}
monocle().watchDirectory({
root: options.root,
listener: onFileChange
});
};
Pretty simple, eh? The whole thing can be found over at my gulp starter kit: https://github.com/chrisdavies/gulp_starter_kit
It is important to note that it looks like gulp.watch only reports changed and deleted files on Windows but listens for new and deleted files by default on OSX:
https://github.com/gulpjs/gulp/issues/675
You should use 'gulp-watch' for new/renamed/deleted files instead of gulp.watch
var gulpwatch = require('gulp-watch');
var source = './assets',
destination = './dest';
gulp.task('copy-changed-assets', function() {
gulpwatch(source+'/**/*', function(obj){
gulp.src( obj.path, { "base": source})
.pipe(gulp.dest(destination));
});
});
참고URL : https://stackoverflow.com/questions/22391527/gulps-gulp-watch-not-triggered-for-new-or-deleted-files
'IT story' 카테고리의 다른 글
socket.io 방 또는 네임 스페이스? (0) | 2020.06.10 |
---|---|
git에서 비 단계적 변경의 일부를 취소 (0) | 2020.06.10 |
JavaScript : 선택에 따라 양식 동작 속성 값을 변경하는 방법은 무엇입니까? (0) | 2020.06.10 |
자바 스크립트에서 페이지가 새로 고침되거나 새로 고침되는지 확인 (0) | 2020.06.10 |
mongoDB가 데이터를 저장하는 위치를 어떻게 알 수 있습니까? (0) | 2020.06.10 |