Question

很抱歉，这很难解释，但我希望能够更改任何文件（包括已导入的文件）并让它通过观看更新网站。

我有一个根级别（来自src）site.less文件。

我还在src文件夹中散布了各种较少的文件，并从site.less文件中导入它们。

当我运行au run --watch时，这个初始构建正在为我的应用程序成功更新css。然后，当我更新较少的文件时，它会触发刷新但网站不会随更改而更新。

为了解决这个问题，我更改了aurelia_project / tasks / watch中的监视文件。 - 我已经做到这一点，当更改较少的文件时，它只会将我的root少文件添加到pendingRefreshPaths。

现在，当我更改并保存导入的较少文件时，它会触发添加相应文件（包括根目录）但尚未更新网站的监视刷新。

如果我然后打开root less文件并保存但没有更改它也会这样做，不会显示任何更改。

我认为我需要查看的奇怪的事情和线索是，如果我更改root少文件的内容然后保存，那么一切都按预期工作。

因此，我认为我需要在管道中的某个地方进行欺骗，以使其认为对root文件有一个真正的改变，以便来自其他较少文件的监视实际上是成功的。

尽管在pendingRefreshPaths中，它忽略了未更改的文件的任何想法？

Answer 1

找到了罪魁祸首，它是被过滤掉的changedInPlace函数。

因此，如果我删除它，现在当我更改任何.less文件时，它会查询root .less文件，这显然会成功导入并编译其他文件。

export default function processCSS() {
  return gulp.src(project.cssProcessor.source) <--- remove this
    //.pipe(changedInPlace({firstPass:true}))
    .pipe(plumber({ errorHandler: notify.onError('Error: <%= error.message %>') }))
    .pipe(sourcemaps.init())
    .pipe(less())
    .pipe(build.bundle());
}

watch.ts

let watch = (callback?) => {
  watchCallback = callback || watchCallback;
  return gulpWatch(
    Object.keys(watches),
    {
      read: false, // performance optimization: do not read actual file contents
      verbose: true
    },
    (vinyl) => {
      if (vinyl.path && vinyl.cwd && vinyl.path.startsWith(vinyl.cwd)) {
        let pathToAdd = vinyl.path.substr(vinyl.cwd.length + 1);

        if (pathToAdd.endsWith(".less")) { 
          log(`Watcher: Adding path src\\site.less to pending build changes...`);
          // Crude but could be moved to config to define a root
          pendingRefreshPaths.push("src\\site.less");
        }
        else {
          log(`Watcher: Adding path ${pathToAdd} to pending build changes...`);
          pendingRefreshPaths.push(pathToAdd);
        }
        refresh();
      }
    });
};

获取导入的.less文件，以便在Aurelia中使用au run --watch进行更新

1 个答案: