我使用gulp sass来编译,前缀和最小化scss到css和min.css,每次保存文件时,我都会使用watch来触发编译,但是突然的gulp-sass仅在保存部分内容时停止写入输出文件保存主样式时效果很好。scss
在这两种情况下,这都是我终端上的SASS日志,无论是保存主文件还是部分scss文件。如您所见,它两次都触发,但仅在保存的主文件上生成并保存输出。
[11:54:50] Starting 'sass'...
[11:54:51] Finished 'sass' after 886 ms
[11:54:52] Starting 'sass'...
[11:54:53] Finished 'sass' after 809 ms
Gulp已全局安装,下面的Gulpfile.js一直可以使用到昨天。 我试图多次更改gulp.src路径,但是没有运气。 显然,我仍然可以编译保存main style.scss的所有内容,但是当您同时处理多个文件时确实很烦人。
另一个奇怪的事情是,试图更改文件路径以编译压缩后的版本已还原为较旧的日期版本;我以为这可能是NPM缓存问题,但是我对node / npm并不是很确定,我只是用它来编译SCSS和连接JS,就是这样。
非常感谢任何可以帮助我的人。
var themeurl = './';
var gulp = require('gulp');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var rename = require("gulp-rename");
var watch = require('gulp-watch');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var cleanCSS = require('gulp-clean-css');
var sourcemaps = require('gulp-sourcemaps');
gulp.task('sass', function () {
return gulp.src(themeurl + '_sass/style.scss')
.pipe(sourcemaps.init())
.pipe(sass().on('error', sass.logError))
.pipe(autoprefixer({
browsers: ['last 10 versions']
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest(themeurl))
.pipe(cleanCSS({compatibility: 'ie8'}))
.pipe(rename('style.min.css'))
.pipe(gulp.dest(themeurl));
});
gulp.task('scripts', function() {
gulp.src('_js/*.js')
.pipe(concat('scripts.js'))
.pipe(gulp.dest('assets/js'));
return gulp.src(themeurl + 'assets/js/scripts.js')
.pipe(uglify().on('error', function(e){
console.log(e);
}))
.pipe(rename('scripts.min.js'))
.pipe(gulp.dest(themeurl+'assets/js/'));
});
gulp.task('watch', function () {
gulp.watch(themeurl + '_sass/**/*.scss', gulp.series('sass') );
gulp.watch(themeurl + '_js/*.js', gulp.series('scripts') );
});
答案 0 :(得分:1)
您解决了问题吗?我有同样的问题。
我的解决方法与我如何编写监视任务有关。而且我必须在每次进行新编译之前都删除css bundle
// old
watch(`${paths.src}/sass/**/*.scss`, series(css, reload));
// workaround
watch(`${paths.src}/sass/*.scss`, series(delCSSbundle, css, reload));
结果是CSS捆绑软件的内容在每次编译时都会更新,但是捆绑软件的日期/时间保持不变。
答案 1 :(得分:0)
将style
替换为*
时是否起作用,如下面的代码块所示? *
告诉gulp在文件夹中搜索所有以.scss结尾的文件。
gulp.task('sass', function () {
return gulp.src(themeurl + '_sass/*.scss')
.pipe(sourcemaps.init())
.pipe(sass().on('error', sass.logError))
.pipe(autoprefixer({
browsers: ['last 10 versions']
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest(themeurl))
.pipe(cleanCSS({compatibility: 'ie8'}))
.pipe(rename('style.min.css'))
.pipe(gulp.dest(themeurl));
});
答案 2 :(得分:0)
谢谢Remco,我已经尝试过,但不幸的是没有任何改变。 正如我在更新中描述的那样,问题似乎与文件的日期/时间有关,而不与编译有关:我的所有修改都对编译进行了更新,但日期/时间却没有。