当使用gulp.task将.scss更改为.css时,如何打开行注释的gulp-compass配置选项?

时间:2016-04-22 16:07:47

标签: css ruby sass gulp-compass

https://www.npmjs.com/package/gulp-compass

以上链接表示评论配置选项默认为false。我试图更改我的gulpfile.js以包含该选项并将其更改为true但我的.css文件仍然没有注释。你能告诉我在css文件中包含评论需要做些什么吗?我试过评论:是的,评论:' true',line_comments:true(' true')。没有任何效果。

以下是我尝试更改的代码:

var gulp = require('gulp'),
    gutil = require('gulp-util'),
    coffee = require('gulp-coffee'),
    browserify = require('gulp-browserify'),
    compass = require('gulp-compass'),
    concat = require('gulp-concat');


var coffeeSources = ['components/coffee/*.coffee'];
var jsSources = [
    'components/scripts/rclick.js',
    'components/scripts/pixgrid.js',
    'components/scripts/tagline.js',
    'components/scripts/template.js'

];

var sassSources = ['components/sass/style.scss'];

gulp.task('coffee', function() {
    gulp.src(coffeeSources)
    .pipe(coffee({ bare: true })
      .on('error', gutil.log))
    .pipe(gulp.dest('components/scripts'))
});

gulp.task('js', function() {
    gulp.src(jsSources)
        .pipe(concat('script.js'))
        .pipe(browserify())
        .pipe(gulp.dest('builds/development/js'))

});

gulp.task('compass', function() {
    gulp.src(sassSources)
        .pipe(compass({
            sass: 'components/sass',
            image: 'builds/development/images',
            style: 'expanded',
            comments: 'true'
        }))
        .on('error', gutil.log)
        .pipe(gulp.dest('builds/development/css'))

});

这是输出的style.css表仍然没有评论

body {
  background: #eddbba;
  font-family: "Inika", serif;
  font-size: 1.1em;
}

#content {
  color: #CC8E94;
  font-size: 2em;
}

.container {
  width: 90%;
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}

这应该是什么样的

@import "http://fonts.googleapis.com/css?family=Patua+One|Inika";
/* line 3, ../components/sass/_base.scss */
body {
  background: #eddbba;
  font-family: "Inika", serif;
  font-size: 1.1em;
}

/* line 9, ../components/sass/_base.scss */
#content {
  color: #cc8e94;
  font-size: 2em;
}

/* line 14, ../components/sass/_base.scss */
.container {
  width: 90%;
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}

1 个答案:

答案 0 :(得分:0)

我不得不删除gulp.task已经创建的style.css并在git bash.smh中重做gulp指南针任务:((我花了很多时间试图弄清楚为什么这不起作用lol)