用 Gulp 任务替换 Less 的默认任务

Question

我已经从tutorial 下载了 PhoneGap 的 AngularJS 设置。

现在我想使用 Sass 而不是 Less（因为这是我在移植到 PhoneGap 的项目中使用的）。默认的 Less 任务如下所示：

gulp.task('less', function () {
  return gulp.src(config.less.src).pipe(less({
    paths: config.less.paths.map(function(p){
      return path.resolve(__dirname, p);
    })
  }))
  .pipe(mobilizer('app.css', {
    'app.css': {
      hover: 'exclude',
      screens: ['0px']
    },
    'hover.css': {
      hover: 'only',
      screens: ['0px']
    }
  }))
  .pipe(cssmin())
  .pipe(rename({suffix: '.min'}))
  .pipe(gulp.dest(path.join(config.dest, 'css')));
});

我已经为 Sass 尝试了这个 Gulp 任务：

gulp.task('sass', function(){
  return gulp.src('./src/sass/css/main.scss')
  .pipe(sass()) // Using gulp-sass
  .pipe(gulp.dest('./src/css/'));
});

似乎什么都没有发生（看不到新生成的main.scss 文件）。有人可以帮忙吗（我之前没有使用过 Gulp，你可能猜到了。不过我已经通读了this..）

更新： 我实际上并没有替换 Less 任务，我只是为 Sass 添加了另一个任务。

更新 2： 我在这里调用 Sass 任务

gulp.task('watch', function () {
  if(typeof config.server === 'object') {
    gulp.watch([config.dest + '/**/*'], ['livereload']);
  }
  gulp.watch(['./src/html/**/*'], ['html']);
  gulp.watch(['./src/sass/css/*'], ['sass']);
  gulp.watch(['./src/js/**/*', './src/templates/**/*', config.vendor.js], ['js']);
  gulp.watch(['./src/images/**/*'], ['images']);
});

但是问题似乎是它没有被执行。

更新 3： 这是构建阶段代码

gulp.task('build', function(done) {
  var tasks = ['html', 'fonts', 'images', 'sass', 'js'];
  seq('clean', tasks, done);
});

Answer 1

您的路径是绝对的，而不是相对的。不要忘记点 ;)

gulp.task('sass', function(){
    return gulp.src('./src/sass/css/main.scss')
        .pipe(sass())
        .pipe(gulp.dest('./src/css/'));
});