Question

运行 Sass 3.4.3 ，指南针1.0.1 ， Gulp 3.8.8 和 Gulp-compass 1.3.1 < /强>

gulp.task('compass', function() { gulp.src('comp/sass/style.scss') .pipe(compass({ sass: 'comp/sass', image: 'dev/theme/images', style: 'compressed' }) .on('error', gutil.log)) .pipe(gulp.dest('dev/theme/css')) });

指南针任务正在编译sass但压缩不起作用。它输出一个正常的未压缩的css文件。

Answer 1

我遇到了同样的问题：

gulp.task('compass', function() {
    gulp.src(sassSources)
     .pipe(compass({
        sass: 'components/sass',
        image: outputDir + '/images',
        style: sassStyle
     }))
     .on('error', gutil.log)
     .pipe(gulp.dest(outputDir + '/css'))
     .pipe(connect.reload())
});

请注意，在下一部分代码中有条件地定义了这个变量sassStyle，其中node.js process.env进程正在观看＆＃39; NODE_ENV值，因此我们可以在生产文件夹和开发文件夹之间切换：

env = process.env.NODE_ENV || 'development';
 if (env ==='development') {
    outputDir = 'builds/development/';
    sassStyle = 'expanded';
} else {
    outputDir = 'builds/production/';
    sassStyle ='compressed';
}

它没有做到这一点，但手动编辑外部config.rb文件：

config_file: 'config.rb',

在文件中使用此行：

output_style = :compressed

目前，我只是将这些行留在文件中作为解决方法注释掉了。

我使用以下devDependencies：

  "devDependencies": {
    "gulp": "^3.9.1",
    "gulp-browserify": "^0.5.1",
    "gulp-coffee": "^2.3.2",
    "gulp-compass": "^2.1.0",
    "gulp-concat": "^2.6.0",
    "gulp-connect": "^5.0.0",
    "gulp-util": "^3.0.7",
    "jquery": "^3.1.0",
    "mustache": "^2.2.1"
  }

Answer 2

你所得到的应该是有效的，但我认为gulp-compass插件有点配置属性。它在一个单独的config.rb文件中使用输出样式一致地为我工作。

var gulp = require('gulp');
var compass = require('gulp-compass');
var gutil = require('gulp-util');

gulp.task('compass', function() {
    return gulp.src('comp/sass/style.scss')
        .pipe(compass({
            config_file: 'config.rb',
            sass: 'comp/sass',
            image: 'dev/theme/images'
        })
        .on('error', gutil.log))
        .pipe(gulp.dest('dev/theme/css'))
    ;
})

在config.rb文件中使用：

output_style = :compressed

Gulp-compass压缩sass不工作

2 个答案: