Question

我正在Gulp中尝试执行以下操作： 1）将JS文件从指定的文件夹缩小到一个名为“ dist”的文件夹。 2）在最小的文件名后附加“ .min”。 3）提供缩小文件的源地图，并将它们放置在名为“地图”的文件夹中。

我正在使用'gulp-uglify'，'gulp-rename'和'gulp-sourcemaps'。

这里是我所拥有的：

var gulp = require('gulp');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var sourcemaps = require('gulp-sourcemaps');

gulp.task('compress', function () {
    gulp.src('src/*.js')
    .pipe(sourcemaps.init())
    .pipe(uglify())
    .pipe(rename({suffix: '.min'}))
    .pipe(sourcemaps.write('../maps'))
    .pipe(gulp.dest('dist'));
});

一切正常，除了地图文件也附加了“ .min”。如何将重命名限制为仅在dist文件夹中发生？

Answer 1

我做了一些进一步的挖掘，并找到了解决方案。我最终将单个任务分解为两个不同的任务。一旦文件在dist文件夹中，我将调用“重命名”任务。我还使用了“ vinyl-paths”和“ del”来删除重命名的文件。这是我所拥有的：

var gulp = require('gulp');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
var sourcemaps = require('gulp-sourcemaps');
var del = require('del');
var vinylPaths = require('vinyl-paths');

gulp.task('compress', ['uglify','rename']);

gulp.task('uglify', function() {
    return gulp.src('src/*.js')
    .pipe(sourcemaps.init())
    .pipe(uglify())
    .pipe(sourcemaps.write('../maps'))
    .pipe(gulp.dest('dist'));
});

gulp.task('rename', ['uglify'], function() {
    return gulp.src('dist/*.js')
    .pipe(vinylPaths(del))
    .pipe(rename({suffix: '.min'}))
    .pipe(gulp.dest('dist'));
});

Answer 2

可以利用gulp-rename将函数作为输入的能力，将两者合并为一个任务：

gulp.task('prod', function() {
    return gulp.src('src.js'))
        .pipe(sourcemaps.init())
        .pipe(uglify())
        .pipe(sourcemaps.write('.'))
        .pipe(rename(function(path) {
            if (!path.extname.endsWith('.map')) {
                path.basename += '.min';
                //gulp-rename with function only concats 'dirname + basename + extname'
            }
        }))
        .pipe(gulp.dest('build/_asset/js'));
});

如果文件扩展名不是.map，则该函数基本上“仅”附加.min后缀。输出将为src.min.js和src.js.map。

Gulp uglify，重命名和原始地图

2 个答案: