1

js ファイルのディレクトリを 1 つの (縮小された) ソースにコンパイルする gulpfile.js をセットアップしました。しかし、それを処理するためのコードの小さなスニペットが必要です (変更しているオブジェクト リテラルを初期化します) が、これを達成する方法を理解できないようです。(以下の gulpfile を参照)

var jshint = require('gulp-jshint');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
var rename = require('gulp-rename');
gulp.task('build', function() {
    return gulp.src('src/*.js')
        .pipe(concat('ethereal.js'))
        .pipe(gulp.dest('build'))
        .pipe(rename('ethereal.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('build'));
});
gulp.task('lint', function() {
    return gulp.src('src/*.js')
        .pipe(jshint())
        .pipe(jshint.reporter('default'));
});
gulp.task('watch', function() {
    gulp.watch('src/*.js', ["lint", "build"]);
})

src の各ファイルは、出力スクリプトの最初に追加する必要があるオブジェクト リテラルを変更します。

たとえば、src/Game.js は次のようになります。

Ethereal.Game = function() {
    // init game code
}

Ethereal が変更中の実際のオブジェクトであるとどのように想定しているかに注意してください。

TL;DR

  1. gulp ストリーム ファイルの先頭にコード スニペットを追加する方法
  2. それが不可能な場合、どうすれば別のツールでそのような効果を達成できますか?
4

1 に答える 1

2

最初にスニペットを含めるファイルを作成し、次のようにします。

src/first.js 

var Ethereal = function() {
    // define Ethereal class constructor and stuff
}

src/Game.js

Ethereal.Game = function() {
    // init game code
}

次に、gulpfile で次のようにします。

gulp.task('build', function() {
    return gulp.src(['src/first.js', 'src/*.js'])
        .pipe(concat('ethereal.js'))
        .pipe(gulp.dest('build'))
        .pipe(rename('ethereal.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('build'));
});

これにより、 build/ethereal.jsが次のように出力されます。

var Ethereal = function() {
    // define Ethereal class constructor and stuff
} 
Ethereal.Game = function() {
    // init game code
}

または単にhttp://browserify.org/Etherealを使用して、それを実装するすべてのモジュールでモジュールを要求します。

于 2015-01-25T22:39:58.213 に答える