1

我从 LESS 文件生成 CSS，并希望给所有生成的 Bootstrap CSS 文件一个前缀“bootsrtap”，但不给bootstrap.css. 因此，我在编译后直接设置了前缀，但是我所有尝试进一步重命名的尝试都失败了。

var gulp = require('gulp'),
    less = require('gulp-less'),
    watch = require('gulp-watch'),
    prefix = require('gulp-autoprefixer'),
    plumber = require('gulp-plumber'),
    filter = require('gulp-filter'),
    rename = require('gulp-rename'),
    path = require('path')
;

// ...

gulp.task('build-vendors', function() {
    gulp.src(['./public/components/bootstrap/less/theme.less', './public/components/bootstrap/less/bootstrap.less']) // path to less file
        .pipe(plumber())
        .pipe(less())
        .pipe(rename({prefix: 'bootstrap-'}))
        .pipe(gulp.dest('./public/css')) // path to css directory
    ;
});

gulp.task('clean-up', function() {
    // const bootstrapFileRenameFilter = filter(['*', 'bootstrap-bootstrap.css']);    
    gulp.src('./public/css/bootstrap-bootstrap.css')
        .pipe(plumber())
        // .pipe(bootstrapFileRenameFilter)
        .pipe(rename({basename: 'bootstrap.css'}))
        .pipe(gulp.dest('./public/css'))
    ;
});

gulp.task('watch', function() {
    gulp.watch('public/less/*.less', ['build-less', 'build-vendors'])
});

// gulp.task('default', ['watch', 'build-less', 'build-vendors']);
gulp.task('default', ['build-less', 'build-vendors', 'clean-up']);

我的期望：

./public/css/bootstrap-theme.css
./public/css/bootstrap.css

我目前得到的：

./public/css/bootstrap-theme.css
./public/css/bootstrap-bootstrap.css

如何将单个文件从a.footo重命名b.bar？

4

1 回答 1

1

gulp-rename接受一个函数作为参数来进行重命名。这允许您使用您喜欢的任何标准来定位特定文件以进行重命名。在你的情况下：

gulp.task('build-vendors', function() {
    gulp.src(['./public/components/bootstrap/less/theme.less',
              './public/components/bootstrap/less/bootstrap.less']) 
        .pipe(plumber())
        .pipe(less())
        .pipe(rename(function(path) {
            //rename all files except 'bootstrap.css'
            if (path.basename + path.extname !== 'bootstrap.css') {
                path.basename = 'bootstrap-' + path.basename;
            }
        }))
        .pipe(gulp.dest('./public/css'));
});

由于您现在只重命名那些您真正想要具有bootstrap-前缀的文件，因此您不必事后清理您的混乱，并且可以完全放弃整个clean任务。

于 2016-02-22T19:34:21.603 回答