1

キャッシュの問題を回避するために、gulp-inject と hash-generator を使用して、毎回一意の名前で JavaScript ファイルを作成しています。問題は、ソースで何も変更されていない場合でも、 npm ビルドファイルを実行するたびに再構築されることです。clean と inject を実行する前に、ソース ファイルに何か変更があったかどうかを確認したいと思います。gulp-changedには解決策があると思いますが、ハッシュとクリーニングで機能させる方法がわかりません。私の実装の一部は次のようになります。

gulp.task('clean-scripts', function () {
// return del(['./static/js/**/*.js'])
return gulp.src(['./static/js/temp/**/*.js', './static/css/**/style-*.css'], {read: false})
.pipe(clean());
});

gulp.task('index', function () {
var target = gulp.src('./templates/base.html');
// It's not necessary to read the files (will speed up things), we're only after their paths: 
var sources = gulp.src(['./static/js/temp/**/*.js', './static/css/'+cssFileName], {read: false}, {relative : true});

return target.pipe(inject(sources))
.pipe(gulp.dest('./templates'));
});
4

1 に答える 1

2

gulp-revまたは forkを使用してこれを行うことができますgulp-revall。gulp-revドキュメントはかなりむき出しです。gulp-revall両方の機能とその違いについては、ドキュメントを参照してください(最大の違いはgulp-rev-all、渡すファイルだけでなく、それらが参照するファイルの変更もチェックすることです)。

これが提供したgulpタスクにどのように適合するかを正確に伝えるのに少し問題がありますが、各プラグインの一般的な例を次に示します。

  • gulp rev/srcのすべてを にコピー/dest-revし、ファイル名にハッシュを追加します (デフォルトの形式はbasename-a2c4e6g8i0.extです。ハッシュにプレフィックスやサフィックスを追加したり、拡張子を変更したりできます)。
  • gulp revall同じことを行いますが、使用します/dest-revall(デフォルトの形式はbasename.a2c4e6g8.extです。ハッシュにプレフィックスを追加し、ベース名を変換し、ファイルのパスを変換し、ハッシュの長さを変更できます)。

ハッシュはファイルの内容に依存します。ファイルを変更すると、ハッシュが変更されます。ファイルを元に戻すと、ハッシュが元に戻ります。(便利: 誰かが訪問し、変更されたバージョンを新しいハッシュでプッシュすると、変更が間違いであることに気づき、元に戻し、元に戻したバージョンをプッシュします。訪問者がプッシュの間に更新しない場合でも、訪問者は引き続きキャッシュされたコピーに頼ることができます。)

package.json 内

"dependencies": {
  "del": "^2.2.2",
  "gulp": "^3.9.1",
  "gulp-rev": "^7.1.2",
  "gulp-rev-all": "^0.8.24"
}

gulpfile.js

const gulp = require('gulp'),
      del = require('del'),
      rev = require('gulp-rev'),
      revAll = require('gulp-rev-all');

gulp.task('rev', function() {
    del('dest-rev');
    return gulp.src('src/*')
        .pipe(rev())
        .pipe(gulp.dest('dest-rev'));
});

gulp.task('revall', function() {
    del('dest-revall');
    var rev_all = new revAll();
    gulp.src('src/*')
        .pipe(rev_all.revision())
        .pipe(gulp.dest('dest-revall'));
});

gulp-revまたはを使用するかどうかに関係なく、gulp-revall名前が変更されたファイル名を書き換えることができます (また、書き換える必要があります)。詳細については、プラグインのドキュメントを参照してください。

出力ディレクトリを削除していることに注意してください。そうしないと、以前のバージョンのファイルが保持されてしまうからです。以前のバージョンを維持したい場合は、del呼び出しを削除してください。

于 2016-09-08T19:10:55.400 に答える