我怎樣才能更有效地編碼？ - 一個吞嚥任務

Question

也許有人比我有更多的Java腳本經驗可以回答這個問題。到目前爲止，我已經在'usemin'塊中複製了&粘貼，如課程中所示。這裏是代碼：

gulp.task('useminTrigger', ['deleteDistFolder'], function() { 
    gulp.start("usemin", "usemin-de"); 
}); 

gulp.task('usemin', ['styles', 'scripts'], function() { 
    return gulp.src("./app/index.html") 
    .pipe(usemin({ 
     css: [function() {return rev()}, function() {return cssnano()}], 
     js: [function() {return rev()}, function() {return uglify()}] 
    })) 
    .pipe(gulp.dest("./dist")); 
}); 

gulp.task('usemin-de', ['styles', 'scripts'], function() { 
    return gulp.src("./app/de/index.html") 
    .pipe(usemin({ 
     css: [function() {return rev()}, function() {return cssnano()}], 
     js: [function() {return rev()}, function() {return uglify()}] 
    })) 
    .pipe(gulp.dest("./dist/de")); 
}); 

該腳本的工作原理應該是這樣，但也許有一個更容易或更優雅的方式來編碼。

並以優雅的我的意思是：有沒有辦法來合併的usemin - 阻塞與usemin德在一起嗎？

幫助將非常感激。提前致謝！

Answer 1

如果您使用您gulp.src（也就是說，如果你使用通配符來選擇您想要的gulp.task處理的文件），源文件結構將被保留，所有的方式通過globgulp.dest。

爲了配合剛app/index.html和app/de/index.html你可以使用水珠'./app/{,de}/index.html'（它也將努力使用'./app/{,de/}index.html'或'./app/{.,de}/index.html'）。

那麼你的任務是

gulp.task('usemin', ['styles', 'scripts'], function() { 
    return gulp.src('./app/{,de}/index.html') 
    .pipe(usemin({ 
     css: [function() {return rev()}, function() {return cssnano()}], 
     js: [function() {return rev()}, function() {return uglify()}] 
    })) 
    .pipe(gulp.dest("./dist")); 
}); 

這一個任務將採取./app/index.html和./app/de/index.html的源文件和將輸出文件./dist/index.html和./dist/de/index.html。

請注意，使用glob是必要的 - 如果你只是做了gulp.src(['./app/index.html','./app/de/index.html'])相關的文件結構將不會被保留。 ./app/index.html的處理版本將被寫入./dest/index.html，然後處理後的版本./app/de/index.html將被寫入./dest/index.html（覆蓋第一個輸出文件）。

這是一個很好的glob primer，這裏是一個tester learning tool。

Answer 2

中沒有任何的Javascript或咕嘟咕嘟讓你從提取功能：

您的任務

gulp.task('useminTrigger', ['deleteDistFolder'], function() { 
    gulp.start("usemin", "usemin-de"); 
}); 

gulp.task('usemin', ['styles', 'scripts'], function() { 

    return createMinificationPipe("./app/index.html", "./dist"); 
}); 

gulp.task('usemin-de', ['styles', 'scripts'], function() { 
    return createMinificationPipe("./app/de/index.html", "./dist/de"); 
}); 

常用功能

function createMinificationPipe(src, dest){ 
    return gulp.src(src) 
     .pipe(usemin({ 
      css: [function() {return rev()}, function() {return cssnano()}], 
      js: [function() {return rev()}, function() {return uglify()}] 
     })) 
     .pipe(gulp.dest(dest)); 
}