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']);
阅读 2k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进