Gulp Sass - 如何正确命名输出css？

Question

我在读一本关于上海社会科学院教程这里然后我尝试了一些其他办法,我不能得到本教程中的答案.问题就在于此.我在gulpfile.js中有这段代码

gulp.task('compileNavbar', function() {
    gulp.src('assets/css/sass/**/*.navbar.scss')
        .pipe(sass('navbar.css'))
        .pipe(gulp.dest('assets/css/'));;
});

截至目前,我只有资源/ css/sass/guest.navbar.scss,这段代码正确定位scss文件并将输出css文件放在正确的目录中但是 css被命名为guest.navbar.css我没有期望.我希望它被命名为navbar.css,但如何？

Answer 1

gulp-sass不带任何文件名参数.用gulp-rename重命名文件.如果您.navbar.scss要将多个文件连接到一个navbar.css文件中,请随意使用gulp-concat.这个采用文件名参数:-)

安装gulp-rename时npm install gulp-rename --save-dev

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

return gulp.src('assets/css/sass/**/*/*.navbar.scss')
   .pipe(sass())
   .pipe(rename('navbar.css'))
   .pipe(gulp.dest('assets/css');

要么

安装gulp-concat时npm install gulp-concat --save-dev

var concat = require('gulp-concat');

return gulp.src('assets/css/sass/**/*/*.navbar.scss')
   .pipe(sass())
   .pipe(concat('navbar.css'))
   .pipe(gulp.dest('assets/css');