Question

这是我的app-compass gulp任务：

var compass = require('gulp-compass');
var autoprefixer = require('gulp-autoprefixer');

gulp.task('app-compass', function() {
    var stream = gulp.src('./app/styles/index.scss')
        .pipe(compass({
            css: paths.css,
            sass: 'app/styles',
            image: 'app/assets/images',
            generated_images_path: paths.images
        }))
        .pipe(autoprefixer())
        .pipe(gulp.dest(paths.css));
});

作为指南针的一部分，创建了一个index.css文件。这是一项不必要的操作。我只想要流上的数据而不将其写入文件。明天我可能会更改目的地，例如，我还必须更改罗盘的css属性。
有没有办法告诉指南针不要创建一个css文件，只通过流传递它？

Answer 1

看起来compass和gulp.dest都在创建.css文件。尝试删除.pipe(gulp.dest(paths.css))并确保css配置对象的compass属性指向所需的目标位置。

原始海报的更新代码

gulp.task('app-compass', function() {
    var stream = gulp.src('./app/styles/index.scss')
        .pipe(compass({
            css: paths.css,
            sass: 'app/styles',
            image: 'app/assets/images',
            generated_images_path: paths.images
        }))
        .pipe(autoprefixer());
});

Answer 2

删除罗盘配置中的css: paths.css,。否则罗盘认为它应该直接生成一个css。

var compass = require('gulp-compass');
var autoprefixer = require('gulp-autoprefixer');

gulp.task('app-compass', function() {
    var stream = gulp.src('./app/styles/index.scss')
        .pipe(compass({

            sass: 'app/styles',
            image: 'app/assets/images',
            generated_images_path: paths.images
        }))
        .pipe(autoprefixer())
        .pipe(gulp.dest(paths.css));
});

修改

我刚刚再次运行它，实际上，它在根目录中创建了css目录。我只检查过app / css ...对不起，看起来文档说红宝石指南针不可能以这种方式工作：

请确保添加具有相同值的css和sass选项 config.rb因为罗盘不能直接输出css结果。

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

不幸的是，目前我还没有看到一个好的解决方案。幸运的是，额外的文件生成不会影响你的表现。

或者您可以查看Bourbon，它与Compass非常相似，并且更好地集成到节点环境中（因为它只是没有自己的特殊编译器的mixins）：

https://www.npmjs.com/package/node-bourbon

Answer 3

您是否尝试过以下操作？

var compass = require('gulp-compass');
var autoprefixer = require('gulp-autoprefixer');
var clean = require('gulp-clean');

gulp.task('app-compass', function() {
    var stream = gulp.src('./app/styles/index.scss')
        .pipe(compass({
            css: paths.css,
            sass: 'app/styles',
            image: 'app/assets/images',
            generated_images_path: paths.images
        }))
        .pipe(autoprefixer())
        .pipe(clean())
        .pipe(gulp.dest(paths.css));
});

gulp compass会创建一个不需要的文件而不是仅使用流

3 个答案:

原始海报的更新代码