gulp-rev-replace在子文件夾中的HTML文件上

Question

我想知道如何獲得gulp-rev-replace來替換子文件夾中HTML文件中相同哈希值的文件引用。 考慮以下文件結構

• index.html
• 子文件夾
  • index.html
• 劇本
  • main.js
• 樣式
  • main.scss

和以下html語句：

index.html：

<!-- build:css styles/main.css -->
<link rel="stylesheet" href="/bower_components/normalize-css/normalize.css">
<link rel="stylesheet" href="styles/main.css">
<!-- endbuild -->

subfolder / index.html：

<!-- build:css ../styles/main.css -->
<link rel="stylesheet" href="/bower_components/normalize-css/normalize.css">
<link rel="stylesheet" href="../styles/main.css">
<!-- endbuild -->

還有我的Gulpfile中的以下內容

gulp.task('html', ['styles'], () => {
  const assets = $.useref.assets({searchPath: ['.tmp', 'app', '.']});

  return gulp.src('app/**/*.html')
    .pipe(assets)
    .pipe($.if('*.js', $.uglify()))
    .pipe($.if('*.css', $.minifyCss({compatibility: '*'})))
    .pipe($.rev())
    .pipe(assets.restore())
    .pipe($.useref())
    .pipe($.revReplace())
    .pipe($.if('*.html', $.minifyHtml({conditionals: true, loose: true})))
    .pipe(gulp.dest('dist'));
});

index.html的樣式鏈接塊將替換為正確的縮小和哈希樣式表引用。 subfolder/index.html的相同塊將改為獲得完全不同的哈希樣式表引用。 但是，它確實使樣式表的路徑正確。

我是否正確設置了Gulpfile？

Answer 1

借助這個單獨的答案弄清楚了。 我最終將每個HTML文件中的樣式引用設置為app目錄的根目錄，並提供3個目錄進行搜索：

<!-- build:css({.tmp,app,.}) /styles/main.css -->
<link rel="stylesheet" href="/bower_components/normalize-css/normalize.css">
<link rel="stylesheet" href="/styles/main.css">
<!-- endbuild -->

匹配提供給gulp-useref的三個目錄

const assets = $.useref.assets({searchPath: ['.tmp', 'app', '.']});