我正在尝试创建一个与scss和php一起使用的gulp文件。
一切顺利,但我通过将h1从红色变为黄色来测试它。 Browsersync开始了.H1现在是黄色的。将其更改为绿色。它变绿了。好极了!有用。
但是当我改变一个php文件时,所有改变的css都消失了。即使我删除了我的style.css文件,它仍然可以100%完成工作。它喜欢它缓存css?!我不知道在哪里寻找解决方案。
任何人都可以帮助我吗?
这是我的gulpfile:
var gulp = require('gulp'),
connect = require('gulp-connect-php'),
plumber = require('gulp-plumber'),
rename = require('gulp-rename');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var imagemin = require('gulp-imagemin'),
cache = require('gulp-cache');
var postcss = require('gulp-postcss');
var autoprefixer = require('autoprefixer');
var cssnano = require('cssnano');
var sass = require('gulp-sass');
var browserSync = require('browser-sync');
gulp.task('browser-sync', function () {
connect.server({}, function () {
browserSync({
proxy: 'raak.test'
});
});
});
gulp.task('bs-reload', function () {
browserSync.reload();
});
gulp.task('images', function () {
gulp.src('src/img/*')
.pipe(cache(imagemin({optimizationLevel: 3, progressive: true, interlaced: true})))
.pipe(gulp.dest('assets/img/'));
});
gulp.task('styles', function () {
var processors = [
autoprefixer,
cssnano
];
gulp.src(['src/css/style.scss'])
.pipe(plumber({
errorHandler: function (error) {
console.log(error.message);
this.emit('end');
}
}))
.pipe(sass())
.pipe(postcss(processors))
.pipe(gulp.dest('assets/css/'))
.pipe(rename({suffix: '.min'}))
.pipe(gulp.dest('assets/css/'))
.pipe(browserSync.stream())
});
gulp.task('default', ['browser-sync'], function () {
gulp.watch("**/*.scss", ['styles']);
gulp.watch("**/*.php", ['bs-reload']);
});
答案 0 :(得分:1)
就像它缓存了css
你有没有调查过这个?我发表评论但是我的嫌疑人分数很糟糕。如果您使用chrome中的开发工具(右键单击'检查'),您可以通过按住刷新并单击最后一个选项来进行硬重新加载。这将清除缓存的任何可能性。此外,如果您有服务工作者或正在使用indexeddb,这可能会发生。通常每个人都会以隐身模式开发,以避免这种情况发生!希望这会有所帮助:D