2

如何使用gulp-ruby-sass缓存 Sass 文件?似乎它应该是一个默认选项,但这并没有发生。我肯定错过了什么。

watch任务运行时,每次我更改app/styles/main.scss中的某些内容时,gulp-ruby-sass都会不必要地再次编译 Bootstrap 的 Sass,占用大约4-5 秒的额外时间

我的app/styles/main.scss文件如下所示:

// MY PROJECT DEFAULTS
@import “my_project/variables";

// bower:scss
@import "../bower_components/bootstrap-sass-official/vendor/assets/stylesheets/bootstrap.scss";
// endbower

// ...

gulpfile.js是在2014 年 11 月 25日使用generator-gulp-webapp 0.1.0 生成的,链接到 git repo 的 master 分支。

在这里查看 gulpfile.js

样式功能:

gulp.task('styles', function () {
  return gulp.src('app/styles/main.scss')
    .pipe($.plumber())
    .pipe($.rubySass({
      style: 'expanded',
      precision: 10
    }))
    .pipe($.autoprefixer({browsers: ['last 1 version']}))
    .pipe(gulp.dest('.tmp/styles'));
});

正在创建.sass-cachemain.scssc文件夹,其文件夹包括Bootstrap 的部分内容。

更新

到目前为止,我已经找到了两种解决方案(虽然不是用于缓存,而是用于更快的编译时间):

1) gulp-ruby-sass 版本 1.0 (alpha),它更快并且可以与源映射一起使用。似乎很快就会发布。检查这个

2) gulp-sass使用 C/C++,速度非常快,但没有一些特性。

4

1 回答 1

0

我希望您的问题与https://github.com/sindresorhus/gulp-ruby-sass/issues/111有关。尽管此问题仍然存在,但我无法在使用时确认您的问题generator-gulp-webapp 0.3.0(以及gulp-ruby-sass 1.0.1使用 Sass 3.4.13(选择性史蒂夫))

generator-gulp-webapp 0.3.0默认情况下附带gulp-sass。在使用 Sass 和 Bootstrap 安装 gulp-webapp 后,我将styles任务替换如下:

gulp.task('styles', function () {
    return $.rubySass('app/styles/main.scss') 
    .on('error', function (err) {
      console.error('Error!', err.message);
   })
    .pipe(gulp.dest('.tmp/styles'))
    .pipe(reload({stream: true}));
});

更改任务运行和输出main.scss后:watch

[BS] 1 file changed (main.css) 
[15:53:17] Finished 'styles' after 20 s

现在.sass-cache文件夹的内容如下所示:

/.sass-cache$ ls -la
total 24
drwxrwxr-x 6 bass bass 4096 Apr 13 15:40 .
drwxrwxr-x 9 bass bass 4096 Apr 13 15:48 ..
drwxrwxr-x 2 bass bass 4096 Apr 13 15:40 721aed65acc825809156d020625072c6ea20be50
drwxrwxr-x 2 bass bass 4096 Apr 13 15:40 b311c6377fb599f57cc8c0d0c360c9b83a27e34b
drwxrwxr-x 2 bass bass 4096 Apr 13 15:40 d1eb2de86ef2be3a4571ad5415b5156c01618faf
drwxrwxr-x 2 bass bass 4096 Apr 13 15:53 e2b546d387a82bc59b03d84e84d775c05a23ac82

据了解,仅e2b546d387a82bc59b03d84e84d775c05a23ac82已更改,其中仅包含main.scss.

于 2015-04-13T14:26:24.883 回答