用Gulp任務替換CSS url

Question

我嘗試使用Gulp替換index.html中CSS文件的路徑。問題是我有不同的主題名稱的多個項目，源文件的路徑是在分發包不同

的index.html

<link href="app/style/themes/dark/theme.css" id="hmi-theme" rel="stylesheet" /> 

在我的分發包，主題下的東西複製像SRC \項目\項目\程序\風格\主題

DIST/index.html的

<link href="[set the path here/]app/style/themes/dark/theme.css" id="hmi-theme" rel="stylesheet" /> 

這裏是一飲而盡，發現找到的網址index.html中嘗試：

var gulp = require('gulp'); 
var find = require('gulp-find'); 
var replace = require('gulp-replace'); 

gulp.task('templates', function(){ 
    gulp.src(['index.html']) 
     .pipe(find(/app\/style\/themes\/([^"]*)/g)) 
     .pipe(gulp.dest('file.txt')); 

這工作，我有在目標文件中的值。但是用gulp-replace可以使用這個值來改變HTML文件中的值嗎？

我也試過類似：

.pipe(replace(/app\/style\/themes\/([^"]*)/g, "dist/" + find(/app\/style\/themes\/([^"]*)/g))) 

但index.html中值是：

dist/[object Object] 

Answer 1

好吧，我終於找到了解決辦法：

return gulp.src(path.join(projectDir, 'index.html')) 
    .pipe(replace(/app\/style\/themes\/([^"]*)/g, function(cssPath) { 
     return "my-new-path/" + cssPath; 
    })) 
    .pipe(gulp.dest(distDir));