この gulpfile.js (以下を参照) を半年間使用していましたが、問題なく動作しました。現在、Windows 8.1 64ビットでは、何時間も正常に動作しません。Firefox で LiveReload を使用して RealTime と Growl の変更を確認し、変更されたという通知を受け取ります。
ソースコード全体は次のとおりです。
var gulp = require('gulp'),
gutil = require('gulp-util'),
notify = require('gulp-notify'),
autoprefix = require('gulp-autoprefixer'),
minifyCSS = require('gulp-minify-css'),
exec = require('child_process').exec,
sys = require('sys'),
uglify = require('gulp-uglify'),
changed = require('gulp-changed'),
livereload = require('gulp-livereload'),
rename = require('gulp-rename'),
imagemin = require('gulp-imagemin'),
cache = require('gulp-cache'),
path = require('path'),
watch = require('gulp-watch'),
sass = require('gulp-sass');
// Which directory should Sass compile to?
var targetDir = 'resources/compiled';
// .pipe(minifyCSS())
gulp.task('scss', function () {
gulp.src('resources/uncompiled/**/*.scss')
.pipe(changed(targetDir))
.pipe(sass({errLogToConsole: true}))
.pipe(autoprefix('last 15 version'))
.pipe(changed(targetDir))
.on('error', gutil.log)
.pipe(gulp.dest(targetDir));
//! .sass files -> compile, minify, autoprefix and publish
watch('resources/uncompiled/**/*.scss', function(files) {
return files.pipe(changed(targetDir))
.pipe(sass({errLogToConsole: true}))
.pipe(autoprefix('last 15 version'))
.on('error', gutil.log)
.pipe(gulp.dest(targetDir))
.pipe(notify({
message: "File: <%= file.relative %>",
title: "SASS compiled, minified and published."
}));
});
});
gulp.task('js', function() {
gulp.src('resources/uncompiled/**/*.js')
.pipe(changed(targetDir))
.pipe(uglify())
.pipe(changed(targetDir))
.pipe(gulp.dest(targetDir))
.pipe(notify({
message: "File: <%= file.relative %>",
title: "JavaScript minified and published."
}));
//! .js files -> compress and publish
watch('resources/uncompiled/**/*.js', function(files) {
return files.pipe(changed(targetDir))
.pipe(uglify())
.pipe(rename(function(path) {
path.dirname = path.dirname.replace(/assets\//g, "");
}))
.pipe(changed(targetDir))
.pipe(gulp.dest(targetDir))
.pipe(notify({
message: "File: <%= file.relative %>",
title: "JavaScript minified and published."
}));
});
});
gulp.task('images', function() {
gulp.src(['resources/uncompiled/**/*.png', 'resources/uncompiled/**/*.jpg', 'resources/uncompiled/**/*.ico', 'resources/uncompiled/**/*.gif'])
.pipe(changed(targetDir))
.pipe(cache(imagemin({ optimizationLevel: 5, progressive: true, interlaced: true })))
.pipe(changed(targetDir))
.pipe(gulp.dest(targetDir));
//! image files -> compress and publish
watch(['resources/uncompiled/**/*.png', 'resources/uncompiled/**/*.jpg', 'resources/uncompiled/**/*.ico', 'resources/uncompiled/**/*.gif'], function(files) {
return files.pipe(changed(targetDir))
.pipe(cache(imagemin({ optimizationLevel: 5, progressive: true, interlaced: true })))
.pipe(rename(function(path) {
path.dirname = path.dirname.replace(/assets\//g, "");
}))
.pipe(changed(targetDir))
.pipe(gulp.dest(targetDir))
.pipe(notify({
message: "Image: <%= file.relative %>",
title: "Image optimized and published."
}));
});
});
gulp.task('watch', function () {
// Create LiveReload server
var server = livereload();
// Watch any files in public dir, reload on change
gulp.watch(['resources/compiled/**']).on('change', function(file) {
server.changed(file.path);
});
});
// What tasks does running gulp trigger?
gulp.task('default', ['scss', 'js','images', 'watch']);
さて、これらの行を変更する必要があることに気付きました
gulp.watch(['resources/compiled/**']).on('change', function(file) {
server.changed(file.path);
});
に
livereload.listen();
gulp.watch('resources/uncompiled/**/*.scss', ['scss']);
ver3に対応。gulp(またはgulp-notifications?)のですが、それでも解決しませんでした。
私の問題は、現在、main.sass の変更を認識し、そのファイルを .css ファイルに圧縮し、images/js ファイルを配置して移動したかどうかを通知するために、以前のようにスクリプトを動作させることができないことです。によると。画像の部分はそれほど重要ではありませんが、SASS は重要です。それに応じて、/compiled/css または /compiled/images に配置する必要があります。
sass ファイルを変更して保存しようとするたびに、次のようになります。
path.js:146
throw new TypeError('Arguments to path.resolve must be strings');
^
TypeError: Arguments to path.resolve must be strings
at Object.win32.resolve (path.js:146:13)
at DestroyableTransform._transform (L:\xampp\htdocs\node_modules\gulp-changed\index.js:72:22)
at DestroyableTransform.Transform._read (L:\xampp\htdocs\node_modules\gulp-changed\node_modules\through2\node_modules
\readable-stream\lib\_stream_transform.js:172:10)
at DestroyableTransform.Transform._write (L:\xampp\htdocs\node_modules\gulp-changed\node_modules\through2\node_module
s\readable-stream\lib\_stream_transform.js:160:12)
at doWrite (L:\xampp\htdocs\node_modules\gulp-changed\node_modules\through2\node_modules\readable-stream\lib\_stream_
writable.js:326:12)
at writeOrBuffer (L:\xampp\htdocs\node_modules\gulp-changed\node_modules\through2\node_modules\readable-stream\lib\_s
tream_writable.js:312:5)
at DestroyableTransform.Writable.write (L:\xampp\htdocs\node_modules\gulp-changed\node_modules\through2\node_modules\
readable-stream\lib\_stream_writable.js:239:11)
at DestroyableTransform.Writable.end (L:\xampp\htdocs\node_modules\gulp-changed\node_modules\through2\node_modules\re
adable-stream\lib\_stream_writable.js:467:10)
at File.pipe (L:\xampp\htdocs\node_modules\gulp-watch\node_modules\vinyl\index.js:103:14)
at L:\xampp\htdocs\fusion\_designs\cms-design\gulpfile.js:33:22
at write (L:\xampp\htdocs\node_modules\gulp-watch\index.js:123:9)
at L:\xampp\htdocs\node_modules\gulp-watch\node_modules\vinyl-file\index.js:52:4
at L:\xampp\htdocs\node_modules\gulp-watch\node_modules\vinyl-file\node_modules\graceful-fs\graceful-fs.js:76:16
at fs.js:334:14
at L:\xampp\htdocs\node_modules\gulp-watch\node_modules\vinyl-file\node_modules\graceful-fs\graceful-fs.js:42:10
at L:\xampp\htdocs\node_modules\gulp-watch\node_modules\chokidar\node_modules\readdirp\node_modules\graceful-fs\grace
ful-fs.js:42:10
もちろん、パスを変更しようとしましたが、変数を渡す代わりに関数で直接パスを使用しようとしましたが、役に立ちませんでした。助言がありますか?私は今4時間苦労しており、何とか機能させることができましたが、多くの機能を削除し、毎回gulpを再起動する必要がありました. 画像を「縮小」することもできませんでした。