Konfigurieren Sie Live Reload auf einem Ionic-Projekt basierend auf dem Generator-Schluck-Winkel

Question

Ich habe ein Ionic 1.3.1-Projekt mit einer Architektur auf der Grundlage der, alt, aber Gold, Generator-Schluck-Winkel, in denen ich Live Reload aktivieren möchte auf dem Gerät (Android).

Meine schluck Konfigurationspfade wie folgt aussehen:

exports.paths = { 
    src: 'src', 
    dist: 'www', 
    tmp: '.tmp', 
    e2e: 'e2e' 
}; 

Dies bedeutet, dass das Projekt im Browser ich gulp serve verwenden laufen und ich gulp build && ionic run android verwenden in der Android-Gerät zu laufen.

Ich kann nicht den Befehl ionic run android --livereloadas described in the doc here, weil es die www Ordner synchronisiert, wo (nach einem gulp build) Ich habe die verkleinerte Dateien und nicht die Quelldateien.

Also möchte ich in irgendeiner Weise die beiden Befehle gulp serve und ionic run android --livereload verwechseln, aber aufrichtig weiß ich nicht, wie man das erreicht.

Answer 1

Ich löste die Aktualisierung meiner gulp watch Aufgabe, dass jedes Mal, wenn es eine Änderung gibt es die gulp build läuft, während der Befehl ionic run android --livereload ausgeführt wird.

habe ich eine Flagge --livereload meine gulp watch, so meine /gulp/watch.js Datei wie folgt aussieht:

gulp.task('watch', ['inject'], function() { 

    var livereload = process.argv.length === 4 && process.argv[3] === '--livereload'; 

    gulp.watch([path.join(conf.paths.src, '/*.html'), 'bower.json'], ['inject-reload']); 

    gulp.watch([ 
    path.join(conf.paths.src, '/app/**/*.css'), 
    path.join(conf.paths.src, '/app/**/*.scss'), 
    path.join(conf.paths.src, '/scss/*.scss') 
    ], function(event) { 
    if (livereload) { 
     gulp.start('build'); 
    } else { 
     if(isOnlyChange(event)) { 
     gulp.start('styles-reload'); 
     } else { 
     gulp.start('inject-reload'); 
     } 
    } 
    }); 

    gulp.watch(path.join(conf.paths.src, '/app/**/*.js'), function(event) { 
    if (livereload) { 
     gulp.start('build'); 
    } else { 
     if(isOnlyChange(event)) { 
     gulp.start('scripts-reload'); 
     } else { 
     gulp.start('inject-reload'); 
     } 
    } 
    }); 

    gulp.watch(path.join(conf.paths.src, '/app/**/*.html'), function(event) { 
    if (livereload) { 
     gulp.start('build'); 
    } else { 
     browserSync.reload(event.path); 
    } 
    }); 
}); 

Wie zu verwenden:

auf einem Terminal-Register:

ionic run android --livereload 

und auf ein weiterer Terminalreiter:

gulp watch --livereload 

Genießen Sie!