Gulp sass / gulp watch命令无法覆盖已存在/生成的.css文件。 因此,当文件夹中没有生成的css文件时,该命令工作正常。但是,如果该文件夹上存在文件,我将收到以下错误。
[12:17:39]错误:EPERM:不允许操作,打开'C:\ My folder \ project \ components \ site-products \ demo \ app \ css \ style.css'
var gulp = require('gulp');
var sass = require('gulp-sass');
gulp.task('sass', function () {
return gulp.src('./demo/app/scss/**/*.scss')
.pipe(sass().on('error', sass.logError))
.pipe(gulp.dest('./demo/app/css'));
});
gulp.task('sass:watch', function () {
gulp.watch('./demo/app/scss/**/*.scss', ['sass']);
});
不确定它的相关性,但我没有使用gulp-compass。我正在使用node-sass。 在此先感谢您的帮助。
答案 0 :(得分:1)
最终解决了这个问题,原因是webpack锁定了文件。 使用gulp-chmod绕过它:)
这是最终的脚本:
var gulp = require('gulp');
var sass = require('gulp-sass');
var chmod = require('gulp-chmod');
gulp.task('sass', function () {
return gulp.src('./demo/app/scss/**/*.scss')
.pipe(chmod(0o755))
.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(gulp.dest('./dist/demo/css'));
});
gulp.task('sass:watch', function () {
gulp.watch('./demo/app/scss/**/*.scss', ['sass']);
});
答案 1 :(得分:1)
我得到了相同的信息并使用gulp缓存控制解决了。
我不明白为什么,但它有效!
对你来说,就是这样:
var cache = require('gulp-cached');
gulp.task('cache:docsource', function(){
return gulp.src('./demo/app/**/*.*').pipe(cache('cacheDocSource'));
});
gulp.task('sass', function () {
return gulp.src('./demo/app/scss/**/*.scss')
.pipe(cache('cacheDocSource'))
.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(gulp.dest('./dist/demo/css'));
});
gulp.task('sass:watch', ['cache:docsource'], function () {
gulp.watch('./demo/app/scss/**/*.scss', ['sass']);
});
答案 2 :(得分:0)
您可以使用清洁任务:
// Path
var paths = {
scss: {
input: 'dev/assets/scss/**/*.{scss,sass}',
output: 'public/assets/css'
}
};
// SCSS
gulp.task('scss', function() {
return sass(paths.scss.input)
.pipe(autoprefixer('last 2 version'))
.pipe(cssnano())
.pipe(gulp.dest(paths.scss.output))
.pipe(browserSync.reload({stream: true}));
});
// Clean
gulp.task('clean', function() {
return del(['public/**/*']);
});
// Default
gulp.task('default', ['clean'], function() {
gulp.start('scss');
});