9

これは非常に単純な質問のように思えますが、過去 3 時間かけて調査した結果、watchify を使用していない場合、新しいファイルを保存するたびに処理が遅くなる可能性があることがわかりました。

これは私のディレクトリツリーです:

gulpfile.js
package.json

www/
  default.htm
     <script src="toBundleJsHere/file123.js"></script>

  toBundletheseJs/
    componentX/
       file1.js
    componentY/
       file2.js
    componentZ/
      file3.js

  toPutBundledJsHere/
      file123.js

要件。フォルダー内のファイルを作成または保存するたびに、toBundleTheseJs/このファイルを再バンドルしたいtoBundleJsHere/

ファイルに何を含める必要がありpackage.jsonますか?

そして、gulp ファイルに書き込む必要がある最小値は何ですか?

これは可能な限り高速である必要があるため、browserify と watchify を使用する必要があると思います。最小限の手順を理解したいので、jspm のようなパッケージ マネージャーを使用するのは、この点では過剰です。

ありがとう

4

4 に答える 4

10

まず、目的のディレクトリの変更をリッスンする必要があります。

watch(['toBundletheseJs/**/*.js'], function () {
        gulp.run('bundle-js');
    });

次に、bundle-jsタスクはファイルをバンドルする必要があります。推奨される方法はgulp-concatです:

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

gulp.task('bundle-js', function() {
  return gulp.src('toBundletheseJs/**/*.js')
    .pipe(concat('file123.js'))
    .pipe(gulp.dest('./toPutBundledJsHere/'));
});
于 2016-03-05T19:17:02.667 に答える
1

このコードを使用して、複数のファイルを 1 つにまとめます。

gulp.task('scripts', function() {
      return gulp.src(['./lib/file3.js', './lib/file1.js', './lib/file2.js']) //files separated by comma
        .pipe(concat('script.js'))   //resultant file name
        .pipe(gulp.dest('./dist/')); //Destination where file to be exported
    });
于 2019-06-28T09:48:10.263 に答える
1 
var gulp = require('gulp');
var concat = require('gulp-concat');
gulp.task('js', function (done) {
    // array of all the js paths you want to bundle.
    var scriptSources = ['./node_modules/idb/lib/idb.js', 'js/**/*.js'];
    gulp.src(scriptSources)
        // name of the new file all your js files are to be bundled to.
        .pipe(concat('all.js'))
        // the destination where the new bundled file is going to be saved to.
        .pipe(gulp.dest('dist/js'));
    done();
});
于 2018-06-09T12:46:33.613 に答える