gulp命令执行一次无效果,需要执行两次
我要监听less文件的变化,修改完less文件自动转译和别的操作,保存一次可以转译成css文件,但是后续放到别的文件夹操作无效。下面是我的gulp配置文件,不知道哪里配置错误了,现在每次改完less文件需要保存两次才行,一次无效果。
var path = require('path')
var gulp = require('gulp')
var less = require('gulp-less');//本地安装gulp-less所用到的地方
var autoprefixer = require('gulp-autoprefixer');//自动添加前缀
var gulpSequence = require('gulp-sequence');//保证顺序执行
var cleanCSS = require('gulp-clean-css');//压缩文件
var cssWrap = require('gulp-css-wrap');
var del = require('del');//编译前删除原文件
var themeValue='3897D3';
gulp.task('testAutoFx', function () {
gulp.src(path.resolve('./customTheme/theme-less/index.less'))
.pipe(autoprefixer({
browsers: ['last 3 versions',
'ie >= 8',
'firefox >= 30',
'chrome >= 34',
'safari >= 6',
'opera >= 12.1'
],
cascade: true, //是否美化属性值 默认:true 像这样:
//-webkit-transform: rotate(45deg);
// transform: rotate(45deg);
remove:true //是否去掉不必要的前缀 默认:true
}))
.pipe(less())
.pipe(gulp.dest('customTheme/theme-css'));
});
gulp.task('css-wrap-customTheme', function () {
return gulp.src(path.resolve('./customTheme/theme-css/index.css'))/* 找需要添加命名空间的css文件,支持正则表达式 */
.pipe(cssWrap({
selector: '.custom-'+themeValue /* 添加的命名空间 */
}))
.pipe(cleanCSS())
.pipe(gulp.dest('src/assets/css/customTheme/'+themeValue)) /* 存放的目录 */
});
gulp.task('move-images', function() {
return gulp.src(['./customTheme/theme-less/images/**'])
.pipe(gulp.dest('src/assets/css/customTheme/'+themeValue+'/images'));
});
gulp.task('clean', function (cb) {
return del([
// 这里我们使用一个通配模式来匹配 `mobile` 文件夹中的所有东西
'src/assets/css/customTheme/'+themeValue,
// 我们不希望删掉这个文件,所以我们取反这个匹配模式
'!src/assets/css/customTheme//README.md'
], cb);
});
//保证顺序执行命令
gulp.task('productCustomTheme', function(cb){
gulpSequence('testAutoFx','css-wrap-customTheme','move-images')(cb);
});
//监听less文件发生变化
gulp.task('watch1',['clean'], function () {
gulp.watch('customTheme/theme-less/*',['productCustomTheme']);
});
//自定义主题gulp命令
gulp.task('default',['productCustomTheme','watch1']);
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论