1
私はこのプロジェクト構造を持っています。2つのタスクのGulpワイヤ依存関係
私はinject-bowerのgulp taskを実行すると、それはバウアーフォルダを取り、必要なファイルすべてを注入するようにそれを作りたいです。私がinject-appを実行すると、それはすべてのスクリプトを受け取り、そのように注入します。
私のような1タスクの同時ストリーム内の両方のタスクを置く：
gulp.task('inject', ['inject-bower', 'inject-app'], function() {
console.log('Injection done.');
})
しかし、それだけ亭フォルダを注入するようです。しかし、私がgulp inject-bowerとgulp inject-appを順番に実行すると...それが動作します。
は/ usr/local/binに/ノードは/ usr/local/libに/ node_modules /一気/ binに/ゴクゴク：ここ
は、コンソール出力である：ここで は私gulpfileです.gs --color --gulpfile /Users/dan/Projects/AngularJSApp/gulpfile.js inject [12:21:53] gulpfileを使用する〜/ Projects/AngularJSApp/gulpfile.js [12:21:53]クリーン '... [12:21:53]' inject-app 'を起動しています... [12:21:53] 18ミリ秒後に' inject-app 'を完了しました[12:21:53]終了[12:21:53] 1.89 ms後に 'inject-bower'を完了しました[12:21:53] 'inject into bower'を開始しています'... 注射が完了しました。 [12:21:53] 19μs後に 'inject'を完了しました。 index.htmlに1つのファイルを挿入します。var gulp = require('gulp'), plumber = require('gulp-plumber'), rename = require('gulp-rename'); var autoprefixer = require('gulp-autoprefixer'); var concat = require('gulp-concat'); var uglify = require('gulp-uglify'); var cache = require('gulp-cache'); var minifycss = require('gulp-minify-css'); var sass = require('gulp-sass'); var wiredep = require('wiredep').stream; var inject = require('gulp-inject'); var runSequence = require('run-sequence').use(gulp); var del = require('del'); gulp.task('inject', ['inject-bower', 'inject-app'], function() { console.log('Injection done.'); }) gulp.task('inject-bower', ['clean'], function() { gulp.src('./index.html') .pipe(wiredep({})) .pipe(gulp.dest('./src')); }); gulp.task('clean', function() { return del('src/index.html'); }); gulp.task('inject-app', function() { gulp.src('./src/index.html') .pipe(inject( gulp.src(['./src/js/client/*.js'], {read: true}) )) .pipe(gulp.dest('./src')); }); // For production/dev gulp.task('styles', function(){ gulp.src(['src/stylesheets/*.scss']) .pipe(plumber({ errorHandler: function (error) { console.log(error.message); this.emit('end'); }})) .pipe(sass()) .pipe(autoprefixer('last 2 versions')) .pipe(gulp.dest('src/stylesheets/')) .pipe(rename({suffix: '.min'})) .pipe(minifycss()) .pipe(gulp.dest('src/stylesheets/')) }); // For production. gulp.task('build-scripts', function(){ return gulp.src('src/js/client/**/**/*.js') .pipe(plumber({ errorHandler: function (error) { console.log(error.message); this.emit('end'); }})) .pipe(concat('bundle.js')) .pipe(gulp.dest('src/js/')) .pipe(rename({suffix: '.min'})) .pipe(uglify()) .pipe(gulp.dest('src/js/')) }); gulp.task('default', ['inject'], function(){ //gulp.watch("src/stylesheets/*.scss", ['styles']); //gulp.watch("src/js/client/**/**/*.js", ['scripts']); gulp.watch("*.html", ['inject']); });プロセスは終了コード0
を終え、ここで私はそれで行われていたときに私はsrc/index.html中に残されていますものです：私は間違っ
<!DOCTYPE html ng-app="chat">
<html>
<head>
<title>Hello Chat</title>
<!-- bower:css -->
<link rel="stylesheet" href="bower_components/animate.css/animate.css" />
<!-- endbower -->
<!-- inject:css -->
<!-- endinject -->
</head>
<body>
<h1>Ready to play?</h1>
<section>
Hey man.
<div ng-controller="ChatCtrl"></div>
</section>
<!-- bower:js -->
<script src="bower_components/angular/angular.js"></script>
<script src="bower_components/jquery/dist/jquery.js"></script>
<script src="bower_components/moment/moment.js"></script>
<!-- endbower -->
<!-- inject:js -->
<!-- endinject -->
</body>
</html>
何をしているのですか？
私はgulp injection-bowerとgulp inject-appの両方を同じストリームに入れることができ、すべてがうまくいきました。ありがとうございました。 – nn2