2016-11-11 31 views
5

我有一個Ionic 1.3.1項目的基礎上,舊的,但黃金,發電機 - 吞嚥角的架構,我想啓用Live Reload在設備上(Android)。配置Live Reload的基礎上的發電機 - 吞吐角-Identity

我一飲而盡配置路徑是這樣的:

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

這意味着運行在我使用gulp serve瀏覽器中的項目,並在我使用gulp build && ionic run android在Android設備上運行。

我不能使用命令ionic run android --livereloadas described in the doc here因爲它同步www文件夾中(後gulp build)我有縮小的文件,而不是源文件。

所以我想以某種方式混淆兩個命令gulp serveionic run android --livereload但我真的不知道如何實現這一點。

+0

你好, 你可以查看此鏈接https://codepen.io/leob6/post/quick-tip-using-gulp-to-customize-the-serve-run-and-build-process-for-your -ionic框架,應用程序 – arjunaaji

回答

3

我解決了更新我的gulp watch任務,每次有變更時,它運行gulp build而命令ionic run android --livereload正在運行。

我添加了一個標誌--livereloadgulp watch,所以我/gulp/watch.js文件看起來像:

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); 
    } 
    }); 
}); 

如何使用:

終端標籤:

ionic run android --livereload 

,並在另一個終端選項卡:

gulp watch --livereload 

享受!