Gulp-Inject non funziona

Question

Ho una semplice configurazione del processo di generazione Gulp per il test. Ho letto la documentazione molte volte ma non riesco a convincere Gulp-inject a iniettare gli script che voglio in un file index.html.

file di mio Gulp si presenta così:

gulp.task('inject1', function() { 
    return gulp.src('app/index.html') 
     .pipe(inject(gulp.src('./app/scripts/app.js', {read : false}))) // Not necessary to read the files (will speed up things), we're only after their paths 
     .pipe(gulp.dest("dist")); 
}); 

gulp.task('inject2', function() { 
    return gulp.src('app/scripts/**/*.js', {read : false}) // Not necessary to read the files (will speed up things), we're only after their paths 
     .pipe(inject("./app/index.html")) 
     .pipe(gulp.dest("./dist")); 
}); 

Questo fa parte del mio Index.HTML:

<!-- inject:js --> 

<!-- endinject--> 

Entrambi questi vengono copiati dalla documentazione su GitHub.

Quando eseguo uno di questi compiti la console dice solo "ha iniziato 'iniettare' Finito 'Inject' '

Nella mia cartella ./dist crea un file index.html, ma nessun file js vengono iniettati.

ho provato a digitare nel src e iniettare proprietà molti modo diverso, ma senza fortuna Qualsiasi idea di cosa sto facendo male

Answer 1

Prima di tutto si ha un errore nel tag endinject:.?

<!-- endinject--> 

dovrebbe essere

<!-- endinject --> 

Questo plugin ha lavorato molto per me e per gli altri in varie impostazioni, quindi il problema è probabilmente nella configurazione. Perché quando si utilizza lo streaming, non si può essere sicuri di quali file si collegano, provare sempre a utilizzare un plug-in per vedere esattamente quali file si stanno piping. Raccomando l'uso di gulp-using. Prova questo per eseguire il debug di installazione:

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

gulp.task('inject2', function() { 
return gulp.src('app/scripts/**/*.js', {read : false}) 
    .pipe(debug()) 
    .pipe(inject("./app/index.html")) 
    .pipe(gulp.dest("./dist")); 
}); 

anche assicurarsi di utilizzare lo stesso metodo per verificare di far corrispondere il file html pure. Oltre a questo, sono solo tentativi ed errori finché non si capisce il piping per ottenere i file giusti con il percorso corretto.

Se gulp-inject non sta iniettando alcun file, significa che non è stato eseguito il pipe correttamente, oppure il target inject non era corretto. Il plugin funziona e funziona perfettamente per me.

Se avete bisogno di vedere un esempio di lavoro file di gulp, controlla questo this gulpfile.js gist

Answer 2

Ho avuto lo stesso problema con il seguente codice:

var injectSrc = gulp.src(['./public/css/*.css', '.public/js/*.js'], {read: false}); 
var injectOptions = { 
    ignorePath: '/public' 
}; 
var options = { 
    bowerJson: require('./bower.json'), 
    directory: './public/lib', 
    ignorePath: '../../public' 
} 

gulp.task('inject', function() { 
    return gulp.src('./src/views/*.html') 
      .pipe(debug()) 
      .pipe(wiredep(options)) 
      .pipe(debug()) 
      .pipe(inject(injectSrc, injectOptions)) 
      .pipe(debug()) 
      .pipe(gulp.dest('./src/views')); 

}); 

mio index.html avuto il seguente:

<!--bower:css--> 
<!--endbower--> 
<!--bower:js--> 
<!--endbower--> 
<!--inject:css--> 
<!--endinject--> 
<!--inject:js--> 
<!--endinject--> 

Click on this link to see what my file structure was. L'iniettare stava creando i file CSS c orrettamente ma non i file js. Anche le dipendenze bower funzionavano bene.

Infine ho rilevato il "/" mancante nell'array passato a gulp.src(). Dopo averlo corretto a:

var injectSrc = gulp.src(['./public/css/*.css', './public/js/*.js'], {read: false}); 

funziona correttamente.