web-dev-qa-db-ja.com

Gulp Sass-出力CSSに適切な名前を付ける方法

私はsass here に関するチュートリアルを読んでいます。それから他のアプローチを試みましたが、このチュートリアルで答えを得ることができません。問題があります。 gulpfile.jsにこのコードがあります

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

現在のところ、assets/css/sass/guest.navbar.scssのみがあり、このコードはscssファイルを正しく見つけ、正しいディレクトリに出力cssファイルを置きます[〜＃〜] but [〜＃〜]cssはguest.navbar.cssと名付けられましたが、これは予期していませんでした。 navbar.cssと命名したいのですが、どうすればいいですか？

csssassgulp
21
boi_echos

gulp-sassはファイル名パラメーターを取りません。 gulp-renameを使用して、ファイルの名前を変更します。複数の.navbar.scssファイルを1つの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');
55
ddprrt