gulp watch没有编译sass给css

时间:2016-05-24 22:48:38

标签: css sass gulp watch

我是初学者使用gulp,我尝试使用gulp sass和gulp watch来编译我的sass文件,但是在运行gulp watch命令后没有创建css文件

gulpfile.js

// Include gulp
var gulp = require('gulp');

// Include Our Plugins
var jshint = require('gulp-jshint');
var sass = require('gulp-sass');
var watch = require('gulp-watch');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var sourcemaps = require('gulp-sourcemaps');

//gulp.task('default', function () {
//    // place code for your default task here
//});
gulp.task('default', ['sass', 'watch']);


gulp.task('sass', function () {
  return gulp.src('./sass/*.scss')
    .pipe(sass.sync().on('error', sass.logError))
    .pipe(gulp.dest('./css'));
});

gulp.task('sass', function () {
 return gulp.src('./sass/*.scss')
  .pipe(sourcemaps.init())
  .pipe(sass().on('error', sass.logError))
  .pipe(sourcemaps.write('./maps'))
  .pipe(gulp.dest('./css'));
});

// Watch Files For Changes
gulp.task('watch', function() {
    gulp.watch('./sass/*.scss', ['sass']);
});

项目hiererchy

myProject
     |_ public_html
     |    |_ css
     |    |_ sass
     |    |_ js
     |    |_ index.html
     |_ node_modules
     |_ gulpfile.js
     |_ package.json

当我跑了gulp

[21:37:26] Starting 'sass'...
[21:37:26] Starting 'watch'...
[21:37:26] Finished 'watch' after 7.01 ms
[21:37:26] Finished 'sass' after 29 ms
[21:37:26] Starting 'default'...
[21:37:26] Finished 'default' after 7.11 ?s

2 个答案:

答案 0 :(得分:1)

看起来你的文件路径是错误的。

而不是./sass/*.scss

public_html/sass/*.scss/

请注意./引用当前工作字典。

答案 1 :(得分:0)

你有两个叫做sass的任务尝试删除第一个,因为你真的不需要它。在您的路径开始处./实际上并不是很好的做法,请尝试删除它们。

你也错过了一个回调所以试试这个。

gulp.task('sass', function (cb) {
 return gulp.src('sass/*.scss')
   .pipe(sourcemaps.init())
   .pipe(sass().on('error', sass.logError))
   .pipe(sourcemaps.write('maps'))
   .pipe(gulp.dest('css'), cb());
});