Question

所以，我在项目中使用gulp。

我使用gulp-compass编译我的资产。

而且，我的任务之一是开发人员的监视任务。像这样：

gulp.task('live', function() {
  gulp.watch('path/to/my/scss/files', function(event) {
    console.log('Event type: ' + event.type);
    console.log('Event path: ' + event.path);
    compass(event.path);
  });
});

指南针功能：

function compass(source) {
  return gulp.src(source)
    .pipe(
      plugins.compass({
        config_file: 'config.rb',
        css: 'path/to/my/css/files',
        sass: 'path/to/my/scss/files'
      }).on('error', errorHandler)
    )
    .pipe(gulp.dest('../web/css'))
    .pipe(plugins.livereload());
}

注意：errorHandler函数与我的问题无关。

我以这种方式观看文件的原因是为了让gulp-compass不能编译所有文件，而是已经更改的文件（我将其用于开发，因此我将在一个文件中使用），这个刷新的方式很快，我不必等待（通常，在编译所有scss时大约30~60秒）。 gulp-compass只执行编译，而不是观察。

当我处理非部分文件（即：home.scss）时，这非常有效。

但是如果我改变某个部分的东西，它会被包含在主scss中，那就会出错：它会编译我的部分，也就是说，它不会刷新（我猜它会尝试刷新部分，不感）。

为了实现这一点，我必须对父scss文件进行虚拟修改，并且它可以正常工作。

我知道这是由于我定义我的taks的方式（当时只发送到罗盘一个文件），并且由于gulp-compass执行总是“编译”。

这个gulp-plugin（到目前为止）没有watch命令（除非我修补它，我不想那样做。）

有人知道如何解决这种情况吗？当我改变部分内容时，“他知道”这部分属于某个父母，然后刷新它？

到目前为止，我可以对父母进行虚拟修改，或者明确地观察我正在处理的父scss，但是我希望能够自动进行。

我认为一个解决方案可能是创建一个包含部分所有父项的地图（直接读取文件），如果部分修改，更新所有父项并刷新，但也许这“太贵了”。也许这可能是某种“热身”......

有人有同样的问题吗？你如何使用partials和watch / live-reload环境？

所有这一切的目标是编写代码并让我的浏览器更新，这样我就可以实时查看我的进展并防止跨浏览器问题（少数浏览器同时打开并动态刷新）。

任何建议/帮助将不胜感激！

Answer 1

我无法解决这个问题。

我们放弃指南针，因为我们不再需要它。

我们现在使用node-sass，有时使用bootstrap，有时候发布css等等...

gulp，指南针，活重载＆amp;部分重新加载

1 个答案: