Question

当我使用许多html文件配置useref（gulp v3）时：

我首先创建一个html页面，然后创建第二个页面并运行gulp任务

页面html01.html

 <!-- build:js js/combined.min.js -->
    <script src="../../assets/script01.js"></script>
    <script src="../../assets/script02.js"></script>
 <!-- endbuild -->

页面html02.html

 <!-- build:js js/combined.min.js -->
    <script src="../../assets/script01.js"></script>
    <script src="../../assets/script02.js"></script>
 <!-- endbuild -->

在许多html页面上，我们都有相同的脚本

gulp.task('UpdateCombineCssJs', function() {
    return gulp.src('html/*.html')
        .pipe(useref())
        .pipe(gulpif('*.js', uglify()))
        .pipe(gulpif('*.css', cssnano()))
        .pipe(gulp.dest('dist'));
});

如果我们仅使用html01.html然后使用html02.html运行任务 Combine.min.js文件大小，其内容是两倍。

如果我添加了具有相同参考，大小和三重内容的html03.html

如何避免重复内容，因为目标是优化此文件：Combine.min.js？有特殊设置吗？

Answer 1

如果将gulp-changed中的设置添加到目标目录，则应该停止文件的覆盖或添加。

const changed = require('gulp-changed');

gulp.task('UpdateCombineCssJs', function() {
    return gulp.src('html/*.html')
        .pipe(useref())
        .pipe(gulpif('*.js', uglify()))
        .pipe(gulpif('*.css', cssnano()))
        .pipe(changed('dist'))
        .pipe(gulp.dest('dist'));
});

关于gulp-useref对具有多个html文件的重复内容的问题

1 个答案: