0

私は初めてgulpを使用しています。cssファイルのマージストリーミングを管理しましたが、どういうわけかjavascriptファイルでは機能しません。ここに私のコードがあります、

gulp.task('styles', () => {
  var commonStyles = gulp.src([
   'css/website/bootstrap.min.css',
   'css/website/font.css'
  ])

 // Concatenate and minify styles
 .pipe(minifyCss())
 .pipe(concat('style.min.css'))
 .pipe(gulp.dest('dist/styles'));

 var otherStyles = gulp.src([
  'css/website/landing.css',
  'css/website/careersNew1.css'
 ])
 .pipe(minifyCss())
 .pipe(gulp.dest('dist/styles'));

 return merge(commonStyles, otherStyles);

});

// Concatenate and minify JavaScript
gulp.task('scripts', () => {
 var commonScript = gulp.src([
  'js/scripts/jquery.min.js',
  'js/scripts/bootstrap.min.js'
 ])
.pipe(uglify())
.pipe(concat('style.min.js'))
.pipe(gulp.dest('dist/scripts'));

var otherScript = gulp.src([
 'js/bf_scripts.js',
 'js/custom_rbox.js'
])
.pipe(uglify())
.pipe(gulp.dest('dist/scripts'));

return merge(commonScript, otherScript);
});

CSS出力は正常に機能しています。しかし、dist/scripts/ フォルダーに他のスクリプト ファイルがありません。

4

2 に答える 2

0

uglify()使用している jQuery と Bootstrap のバージョンは既に縮小/醜化されており、処理時間が無駄になり、ビルド スクリプトが遅くなるため、カスタム スクリプトでのみ実行する必要があります。また、ダウンロードしたライブラリは、作成したカスタム コードとは別のフォルダーに保管することをお勧めします。jQuery と Bootstrap をlibフォルダに保存し、コードをsrcフォルダに保存します。その後、個々のファイルを指定する代わりに、ワイルドカード グロブを使用してすべてのファイルを取得できます。

var gulp = require('gulp');
var uglify = require('gulp-uglify');
var concat = require('gulp-concat');
var addsrc = require('gulp-add-src');

gulp.task('scripts', function() {
  // First, uglify custom JS that you wrote
  return gulp.src('src/scripts/**/*.js')
    .pipe(uglify())

    // Now, prepend the already-minfied JS libraries you're importing and concat into style.min.js
    .pipe(addsrc.prepend('lib/scripts/**/*.js'))
    .pipe(concat('style.min.js'))
    .pipe(gulp.dest('dist/scripts'))
})

gulp.task('default', ['scripts'])
于 2015-12-08T12:11:25.860 に答える