使 gulp-usemin 仅丑化非缩小文件

Question

我想将所有 Javascript 放在一个 scripts.js 文件中。这是我的一部分 index.html:

<!-- build:inlinejs js/scripts.js -->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<script src="bower_components/moment/min/moment.min.js"></script>
<script src="bower_components/moment/locale/de.js"></script>
<script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<script src="bower_components/eonasdan-bootstrap-datetimepicker/build/js/bootstrap-datetimepicker.min.js"></script>
<script src="js/main.js"></script>
<!-- endbuild -->

我目前的Gulp配置如下：

gulp.task('usemin', function () {
  return gulp.src('./*.html')
      .pipe(usemin({
        css: [minifyCss(), 'concat'],
        html: [minifyHtml({empty: true})],
        js: [uglify(), rev()],
        inlinejs: [uglify()],
        inlinecss: [minifyCss(), 'concat'],
        inline: ['concat']
      }))
      .pipe(gulp.dest('dist/'));
});

如您所见，已经有很多缩小的 Javascript 文件，所以我不希望我的构建浪费宝贵的时间来丑化已经缩小的文件。我该怎么做才能只丑化非缩小文件？

Answer 1

我知道不久前有人问过这个问题，但我遇到了同样的问题并找到了解决方案。

在您的 html 中，您可以为构建块命名：

<!-- build:jsLibs js/libs.js -->
<script src="bower_components/jquery/dist/jquery.min.js"></script>
<!-- endbuild -->

<!-- build:jsApp js/app.js -->
<script src="js/main.js"></script>
<!-- endbuild -->

并且在 gulp 任务中：

gulp.task('usemin', function () {
    return gulp.src('./*.html')
        .pipe(usemin({
            ...
            jsLibs: ['concat'],
            jsApp: [uglify, rev]
      }))
      .pipe(gulp.dest('dist/'));
});

希望对其他人有所帮助。

使 gulp-usemin 仅丑化非缩小文件

Making gulp-usemin uglify only non-minified files

javascript

node.js

gulp

gulp-uglify

gulp-usemin